4

domReady を使用する前の main.js は次のとおりです。

require.config({
  paths : {
      loader : 'libs/backbone/loader',
      jQuery : 'libs/jquery/jquery-module',
      Underscore : 'libs/underscore/underscore-module',
      Backbone : 'libs/backbone/backbone-module',
      templates : '../Templates'
  }
});

require([ 'app' ], function(app) {
  app.initialize();
});

そして app.js:

define([ 'jQuery', 'Underscore', 'Backbone', 'router',
    'services/Initializers/MainFrameInitializer',
    'services/Initializers/FlowsViewsInitializer',
    'services/Initializers/EditModuleInitializer',
    'services/Sandboxes/ModulesNavigationSandbox',
    'services/Sandboxes/ApplicationStateSandbox', 'DataModel/Constants' ],
    function($, _, Backbone, Router, MainFrameInitializer,
        FlowsViewsInitializer, EditModuleInitializer, ModulesNavigationSandbox,
        ApplicationStateSandbox, Constants) {
      var initialize = function() {
        // Pass in our Router module and call it's initialize function
        MainFrameInitializer.initialize();
        FlowsViewsInitializer.initialize();
        EditModuleInitializer.initialize();
        ApplicationStateSandbox.startCheckStatus();
        ModulesNavigationSandbox.navigate(Constants.Modules.Home);
        // Router.initialize();
      };

      return {
        initialize : initialize
      };
    });

プロジェクトを最適化するまで、すべて正常に動作します。私は、DOM の準備が整う前にスクリプトが実行を開始することを理解しました。これは、最適化前には真実ではありませんでした。とにかく、domReadyプラグインを使用して、DOM が最初に読み込まれるようにしたいと考えています。

しかし、どうやら、それを正しく行う方法がわかりません。main.js の新しいバージョンは次のとおりです。

require.config({
  paths : {
      loader : 'libs/backbone/loader',
      jQuery : 'libs/jquery/jquery-module',
      Underscore : 'libs/underscore/underscore-module',
      Backbone : 'libs/backbone/backbone-module',
      templates : '../Templates'
  }
});

require([ 'domReady', 'app' ], function(domReady, app) {
  domReady(app.initialize);
});

DOM の準備が整う前にappと並行してロードされるため、非常にきちんとしていて非常に間違っています。domReady

どうすれば修正できますか？

ありがとう。

編集

私たちの問題を理解したと思います。依存関係のコンストラクター関数は、appDOM 依存コードを実行しないでください。関数を返すだけで、DOM 依存のロジックをキャプチャする必要があります。そのロジックはapp.initialize、DOM の準備ができたときに実行されることが保証されている から実行する必要があります。

4

3 に答える 3

7

おそらく私は何かを見逃していますが、次のことを行うことであなたの人生をずっと楽にしてくれませんか?

require(['jQuery', 'app' ], function(jQuery, app) {
  jQuery(function ($) {
    app.initialize();
  });
});

あなたのmain.js？

于 2012-02-20T21:30:34.733 に答える
7

domReady コールバック関数内からアプリを要求することで、domReady モジュールを要求し、次にアプリ モジュールを同期的に要求できるはずです。

define(['require', 'domReady'], function(require, domReady) {
  domReady(function() {
    require(['app'], function(app) {
      app.initialize();
    });
  });
});
于 2013-05-10T23:22:48.420 に答える
3

http://requirejs.org/docs/jquery.htmlのドキュメントに従うと、ドキュメントの head に require-jquery ライブラリを埋め込むように求められます。

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

ただし、 githubで入手できる例のソースを見ると、「require-jquery.js」が require lib ファイルと jquery lib ファイルの単純な連結によって生成されていることがわかります。

 cat require.js jquery.js > ../jquery-require-sample/webapp/scripts/require-jquery.js

つまり、head 部分に埋め込まれたスクリプトを、ドキュメントの任意の場所 (たとえば、ドキュメントの一番下) にある次のスクリプト埋め込みに置き換えることができます。

  <script src="libs/require.js"></script>
  <script src="libs/jquery-1.8.0.js"></script>
  <script>require(["main"]);</script>

jquery lib は、以下を含むモジュールとして自身を定義しているためです。

  define( "jquery", [], function () { return jQuery; } );

その後、任意のスクリプトで必要な参照として jquery を使用できます。例えば：

  require(["jquery"], function($) { }
于 2012-08-31T09:15:31.610 に答える