3

私はシングルページWebアプリケーションを構築していますが、要件の1つは、jQuery、jQuery-ui、および開発中に使用することにしたjqueryプラグインです。

また、アプリケーションのMVC構造を形成するためにRequireJSとBackboneを調べています。RequireJSが私が作成したBackboneMVCモジュールのロードに非常に役立つことは間違いありませんが、jQueryとそのプラグインをロードするためにRequireJSを使用することに無関心です。

これは、jQueryがアプリケーション全体のあらゆる場所で使用されるため、グローバル名前空間での使用が許容できると考えているためです。

だから私の質問は:モジュラーコンポーネントと私が必要なグローバルコンポーネントjQueryと見なすものをそのように分離しても大丈夫ですか?

4

2 に答える 2

2

モジュールのロードにはrequireを使用しますが、同様のことを行い、jQueryやアンダースコアなどの「グローバル」コンポーネントをロードするためにrequireを使用しません。どちらのアプローチも有効だと思います(jQueryをロードするためにrequireを使用するかどうか)。

カスタムモジュールをロードするためにrequireJSを選択する理由の1つは、ビルドおよびデプロイプロセスの一部としてオプティマイザーを実行して、アプリケーションがロードする必要のあるスクリプトファイルの数を最小限に抑えたいためです。オプティマイザー(r.jsなど)は、requireJSに指定した依存関係をトレースして、作成するバンドルされたJSファイルを特定できます。複数のサードパーティライブラリを使用している場合は、それらを1つのJSファイルにバンドルすることをお勧めします。 。これが、requireJSを使用してjQueryをロードすることを選択する理由の1つです。

そうでなければ、それはあなたの好み次第だと思います。アプリケーションでrequireJSを使用している場合に、requireJSを使用してjQueryをロードする必要がある技術的な理由を私は知りません。

このドキュメントを読むことをお勧めします。それは理由よりも方法に関するものですが、それでも有用な情報です:http: //requirejs.org/docs/jquery.html

このサンプルプロジェクトもご覧ください:https ://github.com/jrburke/require-jquery

于 2012-11-01T22:06:59.610 に答える
1

あなたはこのようなものが欲しいです:

require.config({
  baseUrl: "/js/",
  paths: {
    jquery: 'libs/jquery/jquery-1.7.1',
    'jquery.mobile-config': 'libs/jqm/jquery.mobile-config',
    'jquery.mobile': 'libs/jqm/jquery.mobile-1.1.0',
    'jquery.mobile.asyncfilter': 'libs/jqm/asyncfilter',
    underscore: 'libs/underscore/underscore-1.3.3',
    backbone: 'libs/backbone/backbone-0.9.2',
    templates: '../templates'
  },
  shim: {
          'underscore': {
            exports: "_"
          },
          'backbone': {
              //These script dependencies should be loaded before loading
              //backbone.js
              deps: ['jquery','underscore'],
              //Once loaded, use the global 'Backbone' as the
              //module value.
              exports: 'Backbone'
          },
          'jquery.mobile-config': ['jquery'],
          'jquery.mobile': ['jquery','jquery.mobile-config'],
          'jquery.mobile.asyncfilter': ['jquery.mobile'],
        }
});

require([
  'jquery',
  'app',
  'jquery.mobile','jquery.mobile.asyncfilter'
], function( $, App ){
    $(function(){
      App.initialize();
    });
});

あなたの場合、jquery-mobileのものをjquery-uiのものに置き換えます。同じ考え。Jqueryは、それ自体をグローバル名前空間に配置するのに十分スマートですが、バージョンによっては、残りは(一般的に言えば)そうではありません。うまくいけば、これはあなたを助けるでしょう。amdと互換性のないライブラリを使用する場合は、上記のようにシムに入れてください。シムは、ライブラリを手動でラップするためのショートカットです(別名、自分自身)。

于 2012-11-02T20:04:08.790 に答える