web-dev-qa-db-ja.com

configにアクセスせずにrequirejsで外部スクリプトをロードします

私が書いているプラ​​グインでデータテーブルの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('resource', ['http://cdn.ajax.blah']);のようなdefine呼び出しを使用しているのを見ました このブログでは 2番目のパラメーターとして。

javascriptjqueryrequirejsdatatables
12
BrDaHa

DataTablesはAMD対応であるため、質問で使用されている方法は機能しません。 AMDスタイルのローダー（RequireJSが存在する）があることを検出した場合は、自身をモジュールとして定義します。ただし、AMDモジュールが<script>でロードされるのはinvalidであるため、エラーメッセージが表示されます。

forum/admin/footerのモジュールは、DataTablesを必要とするように定義する必要があります。

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

（jQueryプラグインであるため、DataTablesモジュールに対応するパラメーターは必要ありません。）

このプラグインを既にRequireJSを構成しているサイトに統合することのより広範な問題に関するいくつかの追加メモ：

  1. require.configは、構成を追加するために複数回呼び出すことができます。ただし、プラグインとメインコード間の調整が予期されていない場合、これは許容できないと見なされる場合があります。

  2. RequireJSには context という概念があります。ドキュメントでは、複数のバージョンをロードすることについて説明していますが、プラグイン固有の構成を許可するようにうまく調整できる場合もあります。

12
Louis

あなたは単純なことを試しましたか？

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

それは間違いなくローカルファイルで動作します。

9
PeteAUK