2

初めてオプティマイザーを使用していますが、いくつかの問題や質問があります。

メインファイルを最適化しようとしていますが、予想どおり、jQuery、Backbone、および Require モジュールを配置します (そして、ナビゲーション全体で使用します)。しかし、いくつかのビューで使用する jQuery プラグインがあるとします。build.js ファイルの「include」オプションを使用して、メイン ファイルに追加しようとしました。それはそれを追加します（例： jQuery Slides ）が、 define("jquery-slides") を使用したビューがあるため（ここでも例です）、ブラウザーはプラグインのファイルを再度読み込みます。メインのビルドファイルにある場合でも。

これは起こると思いますか？これを修正できますか?

ありがとう。

ここにいくつかのコードがあります。それが役立つことを願っています=）

build.js

{
baseUrl: "javascripts/",
appDir: "..",
dir: "dist",
name: "main-site",

include: ['libs/requirejs/require', jquery-slides'],
insertRequire: ['main-site'],

paths: {
    "main-site": 'main-site',
    'jquery': 'libs/jquery/jquery',
    'jquery-slides': 'libs/jquery/plugins/slides.min.jquery'

}
}

main-site.js

require.config({
baseUrl: "/javascripts/",
paths: {
    'jquery': 'libs/jquery/jquery',
    'underscore': 'libs/underscore/underscore',
    'bootstrap': 'libs/bootstrap/bootstrap.min',
    'datepicker': 'libs/bootstrap/plugins/bootstrap-datepicker',
    'backbone': 'libs/backbone/backbone.max',
    'backbone-paginator': 'libs/backbone/plugins/backbone.paginator',
    'backbone-validation': 'libs/backbone/plugins/backbone.validation',
    'text': 'libs/requirejs/text',
    'templates': '/templates/site',
    'views': 'views/site',
    'jquery-cookie': 'libs/jquery/plugins/jquery.cookie',
    'jquery-raty': 'libs/jquery/plugins/jquery.raty.min',
    'jquery-slides': 'libs/jquery/plugins/slides.min.jquery'
},
shim: {
    'backbone-paginator': ['backbone'],
    'bootstrap': ['jquery'],
    'datepicker': ['bootstrap'],
    'jquery-cookies': ['jquery'],
    'jquery-raty': ['jquery'],
    'jquery-slides': ['jquery'],
    'backbone-validation': ['backbone']
}
});

require([
'app-site'
], function(App) {
$(function(){
    App.initialize();
});
});
4

1 に答える 1

2

include を使用する代わりに、ビルドしたいモジュールを宣言することをお勧めします。このようにして、requirejs はモジュールとそのすべての依存関係を最適化されたバンドルにパッケージ化します。

{
    baseUrl: "javascripts/",
    appDir: "..",
    dir: "dist",
    paths: {
        "main-site": 'main-site',
        'jquery': 'libs/jquery/jquery',
        'jquery-slides': 'libs/jquery/plugins/slides.min.jquery'
    },
    modules : [
        {
            name : 'main-site',
        }
    ]
}

その他の考慮事項:

  1. モジュールのいずれかに jquery-slides が依存関係として含まれている場合define(['jquery-slides'], function() {... }、そのモジュールのすべての依存関係が最適化されたファイルに含まれるため、include ディレクティブを使用する必要はありません。

    このリンクの modules プロパティのドキュメントを参照してください

    https://github.com/jrburke/r.js/blob/master/build/example.build.js#L330

  2. mainConfigFile重複を避けるためにプロパティを使用してください https://github.com/jrburke/r.js/blob/master/build/example.build.js#L35

頑張ってください。これがお役に立てば幸いです

于 2013-09-10T05:53:11.060 に答える