31

我一直在使用 requireJS 构建一个单页应用程序，到目前为止我很喜欢它。我已经到了在主应用程序之外开发网站的其他部分的地步，我不确定如何（或是否）为此使用 requireJS。

在我的主应用程序中，一切都是由这个脚本标签触发的：

<script data-main='/scripts/main' src='/scripts/libs/require.js'>

我现在正在开发具有自己的前端脚本的主页。在网站上线时使用优化器，它将所有这些脚本捆绑到一个main.js包中。我正在努力了解我的网站的其余部分适合于此。

假设我的应用程序依赖于 jQuery，并且它被捆绑在应用程序的优化版本中，如果我想在主页上使用 jQuery 怎么办？我不想加载我的应用程序main.js只是为了访问我的 jQuery 模块。所以是的......有点困惑！


我正在想象一个类似这样的网站结构：

/scripts
  - app-main.js //(includes all module dependencies after optimzation)
  - home-main.js //(includes all module dependencies after optimzation)

应用程序：

<script data-main='/scripts/app-main' src='/scripts/libs/require.js'>

主页：

<script data-main='/scripts/home-main' src='/scripts/libs/require.js'>


问题

  1. 如何使用 RequireJS 开发网站的不同部分？
  2. 是否建议有多个 main.js 文件？
  3. 我的不同main.js文件如何共享通用模块，例如 jQuery 后期优化？
4

2 回答 2

38

requirejs 团队在 github 上有一些用于多页应用程序的示例。看看：https ://github.com/requirejs/example-multipage

基本上，您将具有以下结构：

  • page1.html：应用程序的第 1 页。

  • page2.html：应用程序的第 2 页。

  • js app：存储应用程序特定模块的目录。

  • lib：存放第三方模块的目录，如 jQuery。

  • common.js：包含 requirejs 配置，它将成为公共模块集的构建目标。

  • page1.js：用于 page1.html 的数据主。加载公共模块，然后加载 app/main1，即页面 1 的主模块。

  • page2.js：用于 page2.html 的数据主。加载公共模块，然后加载 app/main2，页面 2 的主模块。

于 2012-09-11T03:44:44.573 回答
-1

所以 require.js 应该总是用在任何页面上，以允许模块化和干净的命名空间。我相信每个“应用程序”都需要它自己的 main.js 脚本。优化站点时，r.js 允许您从编译中排除模块，您应该始终为 jQuery 执行此操作。

这样 require.js 将始终动态加载 jquery.js 并且大部分时间从缓存中加载。查找可能在您的应用程序和主页之间缓存的其他模块必须由您自行决定，并且取决于您的用户流量和其他因素。

听起来您有两个项目，一个应用程序和一个营销网站。我相信这些应该分开到相当大的范围，并且应该有他们自己的包含他们自己的 main.js 的各自的“js”文件夹。

于 2011-12-10T11:45:35.483 回答