javascript - <script> 标签上的 data-main 属性不加载 require.js 有效

Question

我偶然发现我能够将我的 data-main js 文件加载到一个不加载 requireJS 的文件中

<script type="text/javascript" src="requirejs.config.js" data-main="theme.js"></script>
<script type="text/javascript" src="requirejs.js"></script>

它完美地加载了我的 theme.js 文件

这是 requirejs 有意设计的功能吗？还是错误？

我希望这不是一个错误。

我的 requirejs.config.js 的内容如下

var require = {
    baseUrl: '/js/',
    paths: {
        'jquery': "lib/jquery/jquery",
        'bootstrap': "lib/bootstrap/js/bootstrap"
    },
    shim: {
        'bootstrap': ['jquery']
    },
    map: {
        '*': {
            'jquery': 'jQueryNoConflict'
        },
        'jQueryNoConflict': {
            'jquery': 'jquery'
        }
    }
}

我检查了这里的每个样本，似乎它们没有做我意外发现的事情。

http://requirejs.org/docs/api.html#data-main

Answer 1

我已经能够使用 RequireJS 2.1.20 重现您的报告的行为。您可以看到here执行检查的代码:

if (isBrowser && !cfg.skipDataMain) {
    //Figure out baseUrl. Get it from the script tag with require.js in it.
    eachReverse(scripts(), function (script) {

eachReverse 循环以相反的顺序查看所有 script 元素。由于 DOM 的工作方式，只有加载 RequireJS 的 script 元素以及 HTML 中它之前的那些元素才会被循环，因为 HTML 仍在处理中。当这段代码执行时，浏览器会解析它。 (因此，加载 RequireJS 后的 script 元素的 DOM 节点尚不存在。)循环中的函数进行搜索，直到遇到一个 script 元素，该元素有data-main。它可能是加载 RequireJS 的那个，也可能是它之前的任何一个。

我不知道是否应将其视为错误或具有意外副作用的功能。人们可能想要更改逻辑以检查 script 元素的 src 属性也指向包含 RequireJS 的文件。然而，在我看来，这很脆弱。 (这不能只是简单的文件名比较，因为如果您决定更改文件名，代码就会中断。)