Question

我正在使用RequireJS，我正在为每个页面创建一个自己的脚本文件。但是我也有一些组件包含在一些页面（服务器端）中。这些页面是否也应该获得自己的脚本文件，或者必要的javascript是否应该包含在页面中？包含页面的某些功能对于许多页面都是通用的。

Answer 1

我认为你最好将你的javascript视为可重复使用的模块，而不是特定于页面的功能。所以，假设你的页面有一个搜索框，它会启动一个AJAX请求，一些日期选择器和一大堆标签。这些中的每一个都应该是一个模块（或者如果它们提供的功能足够复杂，只需要几个模块）。通过将您的应用程序分解为具有非常集中目标的小块，您可以更轻松地单独测试每个位（自动单元测试）并在其他地方重用该功能。

现在关于如何加载你的javascript模块，根据用户需求策略性地加载东西是有意义的（例如：默认加载core.js但是在用户访问之前不会加载search.js） “搜索”选项卡）但您可以将所有内容打包到一个文件中（require's r.js tool为您执行此操作）并在每个页面上使用相同的脚本文件（main.js）。

使用单个脚本文件时，请记住，当js的功能目标不存在时，您的js将需要工作。 jQuery让这个非常简单，你几乎不需要考虑它 - 例如：

$('#js-foo').on(...) // <-- this doesn't blow up if '#js-foo' isn't on the page.

我也看到人们在页面的body标签上设置了data-attr，例如data-page =“foo”和关键的js：

var page = $('body').data('page');
if (page === 'foo'){
    component1.setup();
    component2.setup();
}

在您的情况下，我会尝试使用RequireJS / AMD风格的模块将所有内容构建到单个文件中。每个组件都会获得自己的模块文件（mycomponent.js），你的main.js将需要（）所有模块和init适当的东西，最后你配置你的r.js构建，在部署时将所有内容打包成一个文件在生产中运行。

如果您有兴趣更多地探讨此主题，请查看以下帖子：

Single Entry Point FTW
Single Entry Point Redux

其他页面中包含的页面是否应该有自己的脚本？

1 个答案: