1

AMD を使用しない既存の Web アプリケーションに RequireJS を統合することを検討しています。スクリプトを含めるページには、jQuery やいくつかの一般的な社内スクリプトなど、多数のスクリプトが既に含まれています。

<script>これらのスクリプトの一部を、従来のタグで既にロードした後に Require でロードするとどうなるか興味がありました。これが私が試したものです：

index.html

<script src="js/lib/jquery.js"></script>
<script src="js/lib/require.js" data-main="js/init.js"></script>

init.js

require.config({
   paths: { 
      jquery: "js/lib/jquery"
});
require(["jquery"], function($) {
   //Do stuff
});

js/lib/jquery.js私の希望は、スクリプトをリロードするのではなく、ページに既に読み込まれていることを確認し、それをモジュールとして使用できるほど Require がスマートであることでした。次に、ページの内容を調べたところ、Require が実際にスクリプトをリロードしたことがわかりました。

<script type="text/javascript" src="/js/libs/jquery.js"></script>
...
<script type="text/javascript" charset="utf-8" async="" data-requirecontext="_" data-requiremodule="jquery" src="/js/libs/jquery.js"></script>

これはおそらく、Require が私が望んでいることを行うのに十分なほどスマートであることを期待するのに少し手の届くところにあることを理解していますが、このように機能する場合、Require を既存のサイトと統合する開発者にとっては非常に便利です。そうすれば、必要なコードを変更する必要さえなく、レガシー スクリプトを自由に AMD モジュールに移動できます。夢を見ているだけかもしれませんが。:)

これを行う方法はありますか？

4

1 に答える 1

1

奇妙なことに、スクリプト タグの順序を入れ替えると、jQuery で問題なく動作するはずです。

<script src="js/lib/require.js" data-main="js/init.js"></script>
<script src="js/lib/jquery.js"></script>

jQuery には、「jquery」という名前のモジュールを定義する前に AMD ローダーが存在するかどうかを確認するコードがあるため、RequireJS が最初に読み込まれないと、そのモジュールは登録されません。

これは、AMD ローダーの存在も確認するようにスクリプトを変更しない限り、社内スクリプトには当てはまりません。これを行う方法の背景については、こちらを参照してください: JS ライブラリを設計する場合、RequireJS/AMD 互換にする必要がありますか?

data-main スクリプトは非同期にロードされるため、jquery および requirejs のスクリプトが init.js の前に最初にロードされると想定できるはずですが、混乱を避けるために、次のようにすることもできます。

<script src="js/lib/require.js"></script>
<script src="js/lib/jquery.js"></script>
<script src="js/init.js"></script>
于 2013-08-21T17:59:53.383 に答える