YUI3 ローダーを使用して、javascript および css ファイルのロードを管理します。各ページのブートストラップ js コードの一部として、次のようなものがあります。
YUI({
...
groups: {
...
myGroup: {
modules: {
"my-module": {
...
path: "MyModule.js",
requires: [ "yui-base" ]
},
}
...
}
}
}).use("my-module", function (Y) {
Y.MyModule.doStuff();
});
MyModule.js には次のようなものがあります。
YUI.add('my-module', function (Y) {
Y.MyModule = function () {
...
_validator: Y.Lang.isString
};
}, '3.4.0', {
requires: [ "yui-base" ]
});
YUI はまた、構成で依存関係が指定されている場合、YUI3 以外の「モジュール」でローダーを使用できると主張しています。yui2 グループのモジュール構成の例を以下に示します。
yui2: {
combine: true,
base: 'http://yui.yahooapis.com/2.8.0r4/build/',
comboBase: 'http://yui.yahooapis.com/combo?',
root: '2.8.0r4/build/',
modules: { // one or more external modules that can be loaded along side of YUI
yui2_yde: {
path: "yahoo-dom-event/yahoo-dom-event.js"
},
yui2_anim: {
path: "animation/animation.js",
requires: ['yui2_yde']
}
}
}
これは、yahoo-dom-event.js が読み込まれて実行された後にのみ、YUI が YUI2 の animation.js を読み込んで実行できるほどスマートであることを示唆しています。
私が理解できないのは、これが非 YUI モジュールで機能する場合、なぜ自分のモジュールを YUI.add と冗長な requires リストでラップする必要があるのかということです (requires も構成で指定されているため)。
add ラッパーをドロップしようとしました ( に置き換えました(function (Y) { /* module content */ })(YUI);
) が、これにより、ページの読み込み時に js エラーが発生しました: Y.Lang は未定義です。したがって、どういうわけか、ラッピング add() 呼び出しがないと、Y.Lang が定義されているベース yui スクリプトの前にスクリプトが実行されるようです。しかし、その場合、YUI 以外のモジュール (YUI.add() を呼び出さないモジュール) では問題になりませんか?