私が開発した JavaScript ライブラリに AMD サポートを追加しています。
このライブラリは jquery を使用する場合がありますが、jquery が読み込まれていない場合でも機能します。
モジュールの依存関係を定義するときに、依存関係を「オプション」として設定して、そのライブラリが見つからない場合でもモジュールが機能するようにする方法はありますか?
私が開発した JavaScript ライブラリに AMD サポートを追加しています。
このライブラリは jquery を使用する場合がありますが、jquery が読み込まれていない場合でも機能します。
モジュールの依存関係を定義するときに、依存関係を「オプション」として設定して、そのライブラリが見つからない場合でもモジュールが機能するようにする方法はありますか?
私は最近まったく同じ問題を抱えていましたが、これが私がそれを修正した方法です。空のオブジェクトとして明示的に定義することで、ロードに失敗したモジュールを無視するという RequireJS プラグインをoptional
定義しました (ただし、必要に応じて、null またはその他のものとして定義することもできます)。
コードは次のとおりです (RequireJS 2.1.15 でテスト済み)。
define("optional", [], {
load : function (moduleName, parentRequire, onload, config){
var onLoadSuccess = function(moduleInstance){
// Module successfully loaded, call the onload callback so that
// requirejs can work its internal magic.
onload(moduleInstance);
}
var onLoadFailure = function(err){
// optional module failed to load.
var failedId = err.requireModules && err.requireModules[0];
console.warn("Could not load optional module: " + failedId);
// Undefine the module to cleanup internal stuff in requireJS
requirejs.undef(failedId);
// Now define the module instance as a simple empty object
// (NOTE: you can return any other value you want here)
define(failedId, [], function(){return {};});
// Now require the module make sure that requireJS thinks
// that is it loaded. Since we've just defined it, requirejs
// will not attempt to download any more script files and
// will just call the onLoadSuccess handler immediately
parentRequire([failedId], onLoadSuccess);
}
parentRequire([moduleName], onLoadSuccess, onLoadFailure);
}
});
その後、オプションで単純にモジュールを要求できます
require(['optional!jquery'], function(jquery){...});
jquery モジュールをロードできなかった場合、コールバック関数に渡されるパラメーターは空のオブジェクトになることがわかっています。
実際にはオプションに設定することはできませんが、次を使用してエラーをキャッチし、モジュールをアンロードできますundef
。
require(['jquery'], function ($) {
//Do something with $ here
}, function (err) {
//The errback, error callback
//The error has a list of modules that failed
var failedId = err.requireModules && err.requireModules[0];
if (failedId === 'jquery') {
//undef is function only on the global requirejs object.
//Use it to clear internal knowledge of jQuery. Any modules
//that were dependent on jQuery and in the middle of loading
//will not be loaded yet, they will wait until a valid jQuery
//does load.
requirejs.undef(failedId);
...
}
});
ここに完全な例があります。