17

<script>オプションのAMDをrequirejsでロードできるようにするために、ボイラープレートのタグを介して含まれることを意図したモジュールの1つをラップすることを試みました。

それは非常に苦痛であり、私が思いつくことができた最高のものは次のとおりです。

(function(){
var exports, jQuery;
if (typeof window.define === 'function' && typeof window.requirejs === 'function') {
    exports     = {};
    define(['jquery'], function (jq) {
        jQuery = jq;
        return thisModule();
    });
} else {
    exports     = window;
    jQuery      = window.jQuery;
    thisModule();
}


function thisModule() {
}

})();

これが

  • たくさんの定型文
  • 変数(この場合はjQueryのみ)とamdで依存関係を宣言する必要があります
  • CommonJsをサポートしたい場合は、さらに多くのコードが必要です。

私は主に2番目の点について懸念しています。それは、コアファイルのラップを超えたときに1つがやっかいになるからです。私はそこにいくつかのきちんとした(より)ラッパーの実装があると確信していますが、私は何も見つけることができません。

誰かヒントはありますか?

4

3 に答える 3

8

すでに存在するものを再作成しようとしているのですが、私はまったく同じことを行い、StackOverflowの質問でわずかに異なる解決策を考え出しました。

長い話を短くするために知っておく必要のある名前は「UniversalModuleDefinition」であり、https://github.com/umdjs/umdにさまざまな実装のGitHubがあります。

于 2013-06-28T12:20:42.220 に答える
0

これを内部モジュールまたは外部モジュールに対して実行しようとしていますか?

追加のモジュールを必要としない場合は、AMDを想定してモジュールを構築し、define()関数がコード内の別の場所にない場合は、それをシムアウトすることは可能でしょうか?もちろん、名前付きモジュールを使用する必要がありますが、基本的にはとにかくそれを行う必要があります...

モジュールがすべてdefine()関数からエクスポートを返す場合、それは比較的単純であり、シムされたdefine関数は次のようになります。

//Whatever additional guards you want could be added, of course...
if (typeof(window.define) === undefined){
  window.define = function(name, deps, callback){
    window.myNamespace[name] = callback();
  };
}

少なくともそうすれば、すべてのモジュールに定型文を追加する必要はありません...

相互に依存するサブモジュールが多数ある大規模なライブラリがある場合は、おそらく、Requireを完全に使用するかどうかを確約してから、ライブラリ全体のラッパーコードを使用してAMDサポートを処理する必要があります。 、JqueryとKnockoutJSのやり方。

于 2013-02-14T16:37:26.647 に答える
0

これをハッキングした後、私は次のことを思いついた。これは非常に優れているようで、通常のスクリプトタグにシムとして含めることもできる。

いくつかの注意事項と欠点。

  • ウィンドウオブジェクトの明示的な設定をエクスポートオブジェクトに置き換える必要があります
  • これは、ウィンドウオブジェクトに同様の名前のプロパティとして依存関係が存在することを前提としています(ただし、そのプロパティも必ずそこに配置します)。私の場合、これは一般的に十分に安全ですが、requirejsパス構成のようなものを簡単にハックすることができます。
  • 実際、私は、輸出の概念全体が特に必要であるとは確信していません。少なくとも、すべての場合に必要であるとは限りません。
(function () {
    var define, exports = {};
    if (window.define && window.define.amd) {
        define = window.define;
    } else {
        exports = window;
        define = function (name, dependencies, fn) {
            var deps = [];
            for (var i = 0; i < dependencies.length; i++)
                deps.push(window[dependencies[i]]);
            var module = fn.apply(undefined, deps);
            if (!window[name]) window[name] = module;
        };
    }

    define('mylib.interaction', ['jQuery', 'mylib.core', 'jQuery.UI'], function($, mylib) {
        return /*....blah...*/;
    })
})()
于 2013-02-15T19:06:16.067 に答える