requirejs - 如何加载在单个文件中定义的多个命名 AMD 模块？

Question

我的理解是它不应该发生，但是 it does .这些库最合适的解决方法是什么？

笔记:

我想在 require.js 之后运行这些脚本手动(使用脚本标签)应该可以工作，而且确实看起来确实如此。但是，RequireJS 文档 explicitly warns该data-main脚本异步运行。而require.js应该正确定义 define定义多个命名模块的脚本所需的函数，我还假设没有从 data-main 加载的正确配置脚本，坏事可能会以非确定性的方式发生。它是否正确？

我也看不到 shim 的任何组合, map , bundles和 paths在这种情况下，配置属性可以提供帮助，尽管我希望我错过了它。

澄清第一注: (我的不好，真的不清楚)

我在这里描述的只是手动执行(使用 HTML 脚本标签)定义 RequireJS 和 data-main 之后的多个模块的脚本。脚本。知道后者是异步运行的，我的担忧应该会变得更加明显(但请随时要求我详细说明)。大部分是虽然我似乎可以成功地要求每个命名模块，但我不确定行为是确定性的(而且，它并不漂亮，我宁愿避免额外的脚本标签并异步正确加载所有内容) .

<script src="scripts/require.js" data-main="app/main.js"></script>
<script src="scripts/datajs-1.1.2.js"></script>

在这里，datajs-1.1.2.js 定义了两个模块，如上面链接中所述并复制如下:

// AMD support
if (typeof define === 'function' && define.amd) {
    define('datajs', datajs);
    define('OData', odata);
} ...

Answer 1

什么会起作用和不会起作用取决于定义多个命名模块的文件将如何在应用程序中使用的细节。

通常，如果无法确定单个文件中定义模块(使用命名定义)的顺序，则设置 paths将模块名称映射到定义它们的文件应该可以防止出现问题:

paths: {
    'foo': 'path/to/foobar',
    'bar': 'path/to/foobar'
}

如果 foo或 bar是必需的，RequireJS 将加载定义两者的文件( path/to/foobar.js )，这不是问题。

有了您在问题中添加的详细信息，我可以这样说。首先，这段代码:

<script src="scripts/require.js" data-main="app/main.js"></script>
<script src="scripts/datajs-1.1.2.js"></script>

是不正确的。加载调用 define 的模块通过 <script>标签通常是错误的。 (我会说这总是错误的，但可能会有一些非常奇怪的情况，让不兼容的 Assets 一起工作，你必须做一些通常是错误的事情。但这是不寻常的，必须证明是合理的。)正如你建议这样做，您会遇到时间问题。有时它可能会起作用，有时它可能不起作用。

但是，这应该可以防止任何时间问题:

<script>
require = {
    paths: {
        datajs: 'scripts/datajs-1.1.2',
        OData: 'scripts/datajs-1.1.2'
    }
};
</script>
<script src="scripts/require.js" data-main="app/main.js"></script>

任何需要 datajs-1.1.2.js 中的两个模块中的任何一个时，或者是因为它调用了 require或者因为它叫 define使用适当的模块名称，将加载定义两个模块的文件。

(警告:我在上面示例中显示的配置是有根据的猜测，其中包含足够的详细信息来说明。一旦与 app/main.js 中已经存在的配置结合使用，它可能无法正常工作，我并不是说它是最好的为您的特定应用程序配置 RequireJS 的方法。)

对于 RequireJS 2.1.10 及更高版本，还有 bundles选项，使用起来更好:

<script>
require = {
    bundles: {
      "js/datajs-1.1.2": ["datajs", "OData"]
    }
};
</script>
<script src="scripts/require.js" data-main="app/main.js"></script>

我建议阅读 documentation关于这个选项，以避免对其工作方式可能产生的误解。