我正在研究 RequireJS，但我不确定某些事情。
我了解如何使用 main.js 加载所有依赖项。
但是我需要添加任何逻辑来处理main.js 中的这些依赖项吗？
对我来说，main.js 似乎是一个 document.ready 状态，当文档加载后你就可以在那里输入逻辑，对吧？
对于其他页面和部分视图，我是否需要创建多个 main.js 或者我可以仅引用来自 <script> 中的视图的依赖项中加载的函数？
【问题讨论】：
标签： asp.net-mvc requirejs
更新 - 我添加了一个将 RequireJS 与模块化 HTML 组件一起使用的示例。包含构建工具示例 - https://github.com/simonsmith/modular-html-requirejs
我也写了一篇关于这个的博客文章 - http://simonsmith.io/modular-html-components-with-requirejs/
只使用main.js 的方法是probably more suited to a single page application。
我处理这种情况的方法是在main.js 文件中只包含常见的站点范围的 JS：
在每一页上：
<script src="require.js" data-main="main"></script>
main.js
require.config({
// config options
});
require(['jquery', 'common/ajaxLoader', 'common/someOtherModule'], function($, ajax, otherModule) {
// Modules that do stuff on every page are instantiated here
});
page1.html
<script>
require(['scripts/page1']);
</script>
page1.js
require(['jquery', 'page1Module'], function($, module){
// page1 specific stuff here
});
上面的例子只是处理它的几种方法之一。注意the difference between loading a plain JavaScript file and a module。
我遵循的经验法则是将所有可重用模块（或类，如果它更容易概念化）保留在 define 中，并带有它们自己的依赖项等，然后使用 require 获取这些模块，使用它们的方法或以某种方式与他们互动。
使用这种模式几乎肯定需要使用 domReady 模块that is a separate plugin for RequireJS。例如，使用instead of a ready function in jQuery，因为它允许模块在 DOM 准备好之前开始下载，从而减少了代码执行的等待时间。
编辑你不妨在RequireJS repo中see another example of multi-page application
【讨论】：
main 可以列为page1.js 中的依赖项。不过，我需要测试这种方法。
require 调用。出于多种原因，这似乎是一种不好的做法。
我最近完成了在 ASP.NET MVC 应用程序中使用自动构建优化设置 RequrieJS 的练习。有很多有用的博客文章，例如 Simon 的文章，都是很好的参考。从 ASP.NET 的角度来看，我发现在为多页 ASP.NET 应用程序配置 RequireJS 优化器方面最有用的一个是Making RequireJS play nice with ASP.NET MVC。
利用已有的大量信息，我提出了自己的ASP.NET MVC RequireJS example on GitHub。所包含的大部分内容与已经存在的示例类似，但是为了解决部分视图和多页面需要依赖项的问题，我采取了稍微不同的方法。
_Layout.cshtml
与现有示例最显着的区别是创建了一个自定义 RequireViewPage，它公开了将配置数据传递给 RequrieJS 的方法以及参考页面特定的 require 依赖项。
所以你的 _Layout.cshtml 看起来会很像你所期望的：
<head>
...
@RenderModuleConfig()
<script type="text/javascript" src="@Url.Script("vendor/require.js")" data-main="main"></script>
</head>
<body>
...
视图和部分
为了连接视图（在我的例子中是淘汰视图模型），an additional script fragment 已添加到 _Layout.cshtml 的底部，如下所示
...
@RenderSection("scripts", required: false)
<script type="text/javascript">require(['main'], function () { require(['lib/knockout/knockout.require']); });</script>
</body>
这将确保对于任何视图依赖项，主模块都已加载（假设 main 的依赖项已在 main.js 中定义，然后允许通过数据属性连接视图特定的依赖项。
<div data-require="@MainModule"> ... </div>
<div data-require="@Module("address")"> ... </div>
<div data-require="view\home\index\model"> ... </div>
有关设计和选择的完整说明，请参阅README on GitHub
【讨论】：