javascript - r.js, almond : Is it possible for two . 包含杏仁共享依赖的js文件？

Question

是否可以按如下所示将杏仁与多页设置一起使用:

common.js 在所有页面上加载并包含 almond、bootstrap 和 jquery

main1.js 仅在第 1 页加载并包含杏仁，以及需要 jquery 的 app/main1.js。 当我为 main1.js 运行构建时，我排除了 bootstrap 和 jquery，因为它们很常见。

在第 1 页上，common.js 和 main1.js 已加载，但出现错误:Uncaught Error: app/main1 missing jquery。

可以用杏仁做这个还是我做错了什么？

更新: 我正在使用 django-require 将 python 对象转换为 r.js 的命令行条目，此外它将提供的模块重命名为“杏仁”并将命名模块添加到包含(这可能是导致我的错误的原因？)。另请注意，django-require 不允许包含/排除 REQUIRE_STANDALONE_MODULES，我添加了此功能:

REQUIRE_STANDALONE_MODULES = {

    "common": {
        "out": "common.js",
        "include": ["bootstrap", "jquery"],
        "build_profile": "module.build.js"
    },
    "main1": {
        "out": "main1.js",
        "exclude": ["bootstrap", "jquery"],
        "build_profile": "module.build.js"
    }
}

Main1.js

require(['app/main1']);

这会转换为这样的构建文件条目:

modules = {
    "almond": {
        "out": "common.js",
        "include": ["common", "bootstrap", "jquery"],
        "build_profile": "module.build.js"
    },
    "almond": {
        "out": "main1.js",
        "include:"main1", 
        "exclude": ["bootstrap", "jquery"],
        "build_profile": "module.build.js"
    }
}

Answer 1

这是可能的。你只需要清楚你的包含和排除。在以下设置中，所有模块都存储在 js 子目录中，优化的输出输出到 build。为了简单起见，jQuery 存储为 js/jquery.js，因此无需调用 require.config。

js中的文件有:almond.js、jquery.js、main1.js和main2.js.

这是构建配置:

({
    baseUrl: "js",
    optimize: "none", // So that we can see what is going on in the bundles.
    dir: "build",
    removeCombined: true,
    skipDirOptimize: true,
    modules: [
        {
            name: "common",
            create: true,
            include: ["almond", "jquery"]
        },
        {
            name: "main1",
            exclude: ["jquery"],
            insertRequire: ["main1"]
        },
        {
            name: "main2",
            exclude: ["jquery"],
            insertRequire: ["main2"]
        }
    ]
})

通用模块的 create: true 选项是必需的，以便优化器创建它。据推测，对 require.config 的调用将放在 js/common.js 中，然后您将删除此选项。

此优化的结果在第 1 页上加载:

<script type="text/javascript" src="build/common.js"></script>
<script type="text/javascript" src="build/main1.js"></script>

第 2 页将改为加载 build/main2.js。

加载 Bootstrap 需要 RequireJS 配置，这与一般情况相同，并且在其他方​​面与上面代码中的 jQuery 完全一样。