アプリに必要なモジュールのみを読み込もうとして、問題に苦しんでいます。モジュールのリストは、以下のように異なります。
このコードは、動的ページでインライン化されています。
<script data-main="js/main" src="js/require.js"></script>
<script>
//APPROACH #1
(function(){
<% foreach(DashBoardItem item in AvailableItems){ %>
require('js/dashboard/<%= item.Name.ToLower() %>').init(<%= CurrentUser.ID %>);
<% } %>
}());
</script>
アイデアは、次のようなものを生成することです。
<script>
//APPROACH #1
(function(){
require('js/dashboard/sales').init(123);
require('js/dashboard/inventory').init(123);
require('js/dashboard/deadlines').init(123);
}());
</script>
上記のアプローチでエラーが発生するため、これが可能かどうかはわかりません。
モジュール名「js/dashboard/sales」はコンテキスト用にまだロードされていません: _。require([]) を使用する
代わりにこれを生成しようとしました：
<script>
//APPROACH #2
require(['js/dashboard/sales', 'js/dashboard/inventory', 'js/dashboard/deadlines' ],
function(sales, inventory, deadlines){
sales.init(123);
inventory.init(123);
deadlines.init(123);
});
</script>
しかし、明らかに RequireJS はモジュールがロードされるのを待たず、これら 3 つのコールバック パラメーター ( sales、inventory、deadlines) がundefined実行されるため、これは失敗します。
私はこれについて完全に間違っていますか？必要なモジュールのさまざまなリストをサーバー側からクライアント JS に渡すにはどうすればよいですか?
更新 - 修正済み
私の問題は、モジュール (販売、在庫、期限) が正しく宣言されていなかったことです。以下の@anooperiasのコメントのおかげで、require(...)代わりに使用していたことに気付きdefine(...)ました。だから彼らは次のようでした：
//example of WRONG sales.js module
require(['jquery', 'other-module'], function($, otherModule){
//do stuff, return some object instance
});
以下のように修正すると、上からアプローチ＃2を使用でき、正常に機能しました。
//example of correct sales.js module
define(['jquery', 'other-module'], function($, otherModule){
//do stuff, return some object instance
});