2

これは、CDN の提案に関するこのSO Questionごとに、プレーンな HTML スクリプト タグを使用して行う方法です。これは、ページの残りを保持するシリアル ロード (アンダースコア -> jquery -> バックボーン) になります。

 <script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.4/underscore-min.js"></script>
 <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
 <script src="//cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.10/backbone-min.js"></script>

これらのライブラリは、require.js または同様のノンブロッキング メソッドを使用してどのようにロードしますか?

参照 (API へのリンク)

4

2 に答える 2

3

jquery は AMD フレンドリーなので、require.js 構成でそれを要求するだけで済みます

バックボーンとアンダースコアは AMD フレンドリーではなくなったため、次のオプションがあります。

  1. それらを「外部」として含めることができ、shim は正しい依存関係を割り当てます (こちらのドキュメントとチュートリアルを参照してください) 。

  2. または、AMD 対応の両方のライブラリのわずかに変更されたバージョンを使用できます。それらはこのリポジトリにあります。

  3. 古いバージョンのバックボーンとアンダースコアを使用してください。(非推奨)

注: シミング ルートを選択する場合、これらのライブラリは非同期に読み込まれないことに注意してください。

ライブラリのALTERED VERSIONSを使用した実際の例を次に示します。

require.config({
    enforceDefine: true, //Only libraries AMD Friendly will be loaded
    urlArgs: "bust=" + (new Date()).getTime(), //for development, forces browser to clear the cache
    paths: { // relative paths (to the current file main.js)
        "es5":               'libs/es5-shim/es5-shim',
        "jquery":            'libs/jquery/jquery',
        "jqueryThreeDots":   'libs/jquery/plugins/jquery.ThreeDots',//A jquery plugin
        "underscore":        'libs/underscore/underscore.amd',
        "underscore.string": 'libs/underscore/underscore.string',
        "backbone":          'libs/backbone/backbone.amd',
        "text":              'text',
        "mediator":          'libs/backbone/plugins/backbone.mediator',
        "bootstrap":         'libs/bootstrap/bootstrap.min',
        "rangy":             'libs/rangy/rangy-core.amd',
    },
    shim: {
        "bootstrap": {
            deps: ["jquery"],
            exports: "$.fn.popover"
        }
    }
});

シムを使用した例:

require.config({
    enforceDefine: true,
    urlArgs: "bust=" + (new Date()).getTime(),
    paths: {
        "jquery": 'http://code.jquery.com/jquery-1.9.1.min.js'
    },
    shim: {
        backbone: {
            deps: ["underscore", "jquery"], // Backbone dependencies
            exports: "Backbone" // variable exported
        },
        underscore: {
            exports: "_"
        }
    }
});
于 2013-02-07T19:24:31.507 に答える
1

これは、プロジェクトに Require を使用して jQuery、Underscore、および Backbone を含める方法です。

requirejs.config({
    baseUrl: "js",

    paths: {
        backbone: "backbone-min",
        jquery: "jquery.min",
        underscore: "underscore-min"
    },

    shim: {
        backbone: { deps: ["underscore", "jquery"], exports: "Backbone" },
        jquery: { exports: "jQuery" },
        underscore: { exports: "_" }
    }
});

requirejs(["backbone"], function (Backbone) {
    // Now we can reference not just Backbone but also jQuery and
    // underscore since those two are dependencies for Backbone.
});
于 2013-02-07T19:31:49.977 に答える