RequireJS如何处理多个页面和部分视图？

Question

我正在研究RequireJS,但我不确定某些事情.

我理解如何加载所有依赖项main.js.但是,我是否需要添加任何逻辑来处理这些依赖项main.js？

对我来说,main.js似乎是一个document.ready状态,你在文档加载时输入逻辑,对吧？

对于其他页面和部分视图,我是否需要创建多个main.js或者我是否可以仅从视图中的依赖项中引用加载的函数<script>？

Answer 1

更新 - 我添加了一个使用RequireJS和模块化HTML组件的示例.包含构建工具示例 - https://github.com/simonsmith/modular-html-requirejs

我还写了一篇关于此的博客文章 - http://simonsmith.io/modular-html-components-with-requirejs/

只使用main.js一切的方法可能更适合单页面应用程序.

我处理这种情况的方法是只在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
});

上面的例子只是处理它的几种方法之一.请注意加载普通JavaScript文件和模块之间的区别.

我遵循的经验法则是保留所有可重用的模块(或类,如果它使其更容易概念化),并define使用它们自己的依赖项等,然后使用它们require来获取这些模块,使用它们的方法或以某种方式与它们交互.

使用此模式几乎肯定需要使用domReady模块,该模块是RequireJS的单独插件.例如,在jQuery中使用它而不是ready函数,因为它允许模块在DOM准备好之前开始下载,这减少了代码执行的等待时间.

编辑您可能希望在RequireJS仓库中看到另一个多页面应用程序示例