使用requirejs加载外部脚本而无需访问config

时间:2014-02-07 09:56:17

标签: javascript jquery requirejs datatables

我正在尝试在我正在编写的插件中加载datatables javascript库。问题是我在加载外部资源时遇到冲突,因为当我调用require时,数据表与某些内容冲突。

<!-- DataTables -->
<script type="text/javascript" charset="utf8" src="//cdnjs.cloudflare.com/ajax/libs/datatables/1.9.4/jquery.dataTables.min.js"></script>
...
<script type="text/javascript">
    require(['forum/admin/footer']);  <-- crashes here, line 281
</script>

以下是错误消息:

Uncaught Error: Mismatched anonymous define() module: function (h){var j=function(e){function o(a,b){var c=j.defaults.columns,d=a.aoColumns.length,c=h.extend({},j.models.oColumn,c,{sSortingClass:a.oClasses.sSortable,sSortingClassJUI:a.oClasses.sSor...<omitted>...ch require.js:8
B require.js:8
M require.js:15
d require.js:26
requirejs require.js:31
(anonymous function) (index):281

由于这是一个插件,我有限制我正在尝试解决,例如无法在开头调用require.config()来指定资源的路径。我看到有人使用define这样的电话 define('resource', ['http://cdn.ajax.blah']); in this blog 但它似乎不能以这种方式使用,因为每个其他示例都有一个函数作为第二个参数。

2 个答案:

答案 0 :(得分:11)

问题中使用的方法不起作用,因为DataTables可识别AMD。如果它检测到有一个AMD风格的加载器(RequireJS是),那么它将自己定义为一个模块。但是,加载<script>的AMD模块无效,因此出现错误消息。

应定义forum/admin/footer中的模块以便需要DataTables:

define([..., 
        '//cdnjs.cloudflare.com/ajax/libs/datatables/1.9.4/jquery.dataTables.min.js'], 
        function (...) {
});

(不需要与DataTables模块对应的参数,因为它是一个jQuery插件。)

关于在已配置RequireJS的网站中集成此插件的更广泛问题的一些补充说明:

    可以多次调用
  1. require.config来添加配置。但是,如果插件和主代码之间不需要协调,则可能认为这是不可接受的。

  2. RequireJS的概念为context。该文档讨论了加载多个版本的问题,但也许它可以通过有效的方式进行调整以允许特定于插件的配置。

答案 1 :(得分:8)

你刚试过一个简单的事情:

require(['//cdnjs.cloudflare.com/ajax/libs/datatables/1.9.4/jquery.dataTables.min.js']);

毫无疑问,它适用于本地文件。