RequireJS 不等待模块加载？

Question

我正在努力解决一个问题，尝试仅加载我的应用程序需要的模块。这些模块的清单会因情况不同而变化，如下所示。

此代码是在动态页面中内联的：

<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不会等待模块加载，当它执行时，这三个回调参数（sales，inventory，deadlines）将是未定义的。 我错了吗？我如何将服务器端需要的可变列表传递到客户端JS？

更新-已修复

我的问题是我的模块（销售、库存、期限）声明不正确。感谢@anoopelias下面的评论，我意识到我在其中使用了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
});

- sergiopereira

---

你的第二种方法看起来不错。在这三个模块中，你是否正确地使用了 define 来返回一个对象？ - anoopelias

@anoopelias 定义并不一定需要返回对象，但是为了使模块正常工作，必须对其进行定义（请参阅此处）。 - RestingRobot

@anoopelias，你是正确的。 我仍然在这里和那里混淆这些东西。 在每个仪表板模块声明中，我曾经使用了“define”而不是“require”，第二种方法起作用了。谢谢。 - sergiopereira

@sergiopereira 我认为你的第一种方法也可以在你在其他地方使用第二种方法加载模块后执行。 - anoopelias

你应该发表一个回答来回答你的问题，而不是把答案放在问题里。我也犯了愚蠢的错误，使用了require而不是define。谢谢。 - doug65536

@doug65536 我觉得如果我在自己的问题中添加正确答案会显得有点机会主义。不过，我很高兴它对你有帮助。 - sergiopereira

Answer 1

仅供记录，对于方法＃1，您只是忘记在模块周围加上[]：

 <% foreach(DashBoardItem item in AvailableItems){ %>
      require(['js/dashboard/<%= item.Name.ToLower() %>']).init(<%= CurrentUser.ID %>);  
 <% } %>

除非你的js/main没有要求这些模块，否则requirejs会抱怨。即使你在js/main中包含它们，你也必须“等待”main完成加载（因此将foreach嵌套在对js/main的require调用中）

- pscheit