RequireJS 结构——构建，包括，一般问题

Question

我不明白如何在小型主页项目上正确使用 RequireJS。使用优化器让我更加困惑。

我缺少的是一点一般结构。

加载一个总是的文件是否明智？如果是这样，它应该使用 data-main 加载还是遵循 this simple template 更好？

在这里，使用 data-main 加载的文件仅包含配置，并且需要主应用程序代码作为依赖项（这意味着已经有两个 http 请求，我猜可以由优化器修复）：

// For any third party dependencies, like jQuery, place them in the lib folder.

// Configure loading modules from the lib directory,
// except for 'app' ones, which are in a sibling
// directory.
requirejs.config({
    baseUrl: 'lib',
    paths: {
        app: '../app'
    }
});

// Start loading the main app file. Put all of
// your application logic in there.
requirejs(['app/main']);

使用优化器时，我注意到默认情况下 findNestedDependencies 设置为 false，这意味着在 [=16] 中使用 require() 调用声明的依赖项=] 来电不会被考虑在内。这是否意味着优化后的代码真的应该只包含主要代码——一个或多或少随处使用的应用程序的核心——并且异步加载某些依赖项仍然可以？
我应该如何在构建中包含 require.js？我尝试将它列为核心的依赖项，但这意味着我必须停止使用

<script data-main="assets/js/common" src="assets/js/vendor/require.js"></script>

否则，它将被加载两次（一次作为 common.js 的依赖项，一次因为它在 src 属性中）。

为了只加载一次，我会直接包含 common.js，然后加载 require.js 作为依赖项——我觉得有点奇怪。

Answer 1

Is it wise to have a file, i.e. common.js, that is always loaded? If so, should it be loaded using data-main, or is it better to follow this simple template?

这完全取决于项目的细节。可用性时间很重要的大型项目必须以不同于小型项目的方式来做事。这里没有放之四海而皆准的方法。

When using the optimizer, I noticed by default findNestedDependencies is set to false, which means dependencies declared using a require() call inside a require() call won't be taken into account.

这意味着 require() 调用内部 require() 调用或 define() 调用将不会用于确定整个依赖项列表.

Does that mean the optimized code should really only contain the main code – the core of an application that is used everywhere, more or less – and it's still okay to async load certain dependencies?

RequireJS 始终异步加载依赖项。 findNestedDependencies 没有任何改变。可能你的意思是“仍然可以 可选地 加载某些依赖项”。是的，没关系。我在我的一个项目中这样做。

请注意，findNestedDependencies 与 r.js 跟踪可选依赖项的能力无关。如果 findNestedDependencies 是 true 而你这样做：

define(function () {
    if (some_condition) {
        require(["blah"]);
    }
});

并且此模块包含在构建中，则 blah 也将包含在内。 RequireJS 无法确定 some_condition 是否始终为 false。相反，如果您这样做：

define(function () {
    var deps = [];
    if (some_condition) {
        deps.push("blah");
    }
    require(deps);
});

那么 r.js 将永远不会在构建中包含 blah 因为它没有将源代码解释达到实现这一点所需的水平，就像第一种情况一样，blah 可能需要。所以在后一种情况下 you 必须确保应用程序的核心能够在运行时找到 blah。通常，这意味着 r.js 的构建配置将使用 modules 数组定义核心包，并为每组模块选择加载包。

How am I supposed to include require.js in my build?

可以创建一个包含 RequireJS 的包，这样您就不必单独列出 RequireJS。记录在案 here:

If you want to include require.js with the main.js source, you can use this kind of command:
node ../../r.js -o baseUrl=. paths.requireLib=../../require name=main include=requireLib out=main-built.js
Since "require" is a reserved dependency name, you create a "requireLib" dependency and map it to the require.js file.

Once that optimization is done, you can change the script tag to reference "main-built.js" instead of "require.js", and your optimized project will only need to make one script request.

RequireJS 结构——构建，包括，一般问题

RequireJS structure – build, including, general questions

javascript

requirejs