5

RequireJS モジュールから jQuery の初期化を実行しています。

ただし、コードを実行する前に、すべてのページ アセットが読み込まれるまで RequireJS が待機していることに気付きました。

ページにいくつかの大きな画像を読み込んでいますが、jQuery プラグインをセットアップするためにそれらが読み込まれるまで待ちたくありません。

これを行う際のベストプラクティスはありますか?

これが私のセットアップです：

index.html

<script data-main="js/main.js" src="js/libs/require.js"></script>

main.js

require(["inits"], function(Inits) {
  //Nothing here yet.
});

inits.js

define([
      'jquery', 
      'jquery.plugin1', 
      'jquery.plugin2',
      'etc'
], function ($) {
   //jQuery Document Ready.
   $(function(){
       //Jquery Init Code here
   });
}

私は RequireJS を初めて使用しますが、これは間違っていますか?

4

1 に答える 1

2

さて、私はうまくいっているように見える回避策を持っています。

ここでこのチケットを参照します。

https://github.com/jrburke/requirejs/issues/463

script タグを data-main で body タグの最後に移動しました。

 <script data-main="js/main.js" src="js/libs/require.js"></script>
 </body>

そして、私のjquery関数をアンラップしました：

前

define([
  'jquery', 
  'jquery.plugin1', 
  'jquery.plugin2',
  'etc'
], function ($) {
   //jQuery Document Ready.
   $(function(){
       //Jquery Init Code here
   });
}

後

define([
  'jquery', 
  'jquery.plugin1', 
  'jquery.plugin2',
  'etc'
], function ($) {
   //Jquery Init Code here with no Ready Wrapper.
}

動作しているようで、html ファイルの最後にあることで、DOM に問題が発生するのを防ぐことができます。しかし、私はこのアプローチに完全に満足しているわけではありません。他の人がより良いアイデアを持っているかどうかを確認するために、これを開いたままにしたいと思います。

于 2013-04-01T23:03:28.430 に答える