javascript - 使用 RequireJS 多页和页面模板

Question

我从 requireJS 开始，需要一些帮助来继续它的实现。

我的网站是按照默认值构建的：

    header.html（总是一样的，包含 requiredjs 脚本标签）

    $pageMain（总是变量 - $pageAbout, $pageContact...）

    footer.html（总是一样的）

我需要在我的站点的不同页面中加载特定的 js 文件，但我只有一个标题，其中包含用于设置所需文件的标签。

<script data-main="js/main" src="js/lib/require.js"></script>

当我的页面是 $pageAbout 我需要加载 $pageAbout.js 而不是 $pageMain.js 我仍然无法做到这一点。

检查https://github.com/requirejs/example-multipage#我了解它是如何工作的，但就我而言，我不能这样做，因为我在 header.html 中只指定了一次脚本标记

有什么建议吗？我不知道我的问题是否清楚。请让我知道以更好地解释。

score 1 · Accepted Answer

这里有各种解决方案，具体取决于您可以轻松编辑的内容。

您可以根据当前页面更改标题中的脚本标记。我从您的描述中假设这是不可能的。
如果您必须始终加载相同的js/main脚本，则可以将其用作不同页面特定模块之间的切换：
```
// js/main.js
define(function() {
    var pageId = getPageId();
    require('js/' + pageId);
}); 
```
这取决于能否在标头加载时获取页面 ID - 通过您可以在加载标头之前设置的 JS 变量，或通过解析 URL，或通过其他方式。
您可以简单地从标题中删除脚本标记并将其包含在页面的变量正文中。脚本标签可以出现在文档的任何位置。
您可以从标头脚本标记中删除该data-main属性（以便标头仅加载 RequireJS 库），然后在页面正文中有一个脚本标记以加载特定于页面的模块：
```
<script> require('js/pageAbout'); </script>
```

这些中的任何一个都应该起作用——最后两个可能是最简单的。RequireJS 文档非常规范，但是有很多路径可以实现工作 - 您不必按照推荐的方式进行操作。

1 回答 1