javascript - RequireJS 忽略了一些路径

Question

我有以下 main.js:

requirejs.config({
    paths: {
        'backbone': 'backbone-min',
        'underscore': 'underscore-min',
        'loader': 'loader-min'
    }
})

这个 'loader-min.js' 文件只是来自 loader.js 的优化 js:

define(['backbone', 'underscore'], function () {
})

我的 HTML 页面包含以下内容:

<script data-main="/js/main" src="/js/require.js"></script>
<script type="text/javascript">
   requirejs(['loader'], function(loader) {
      ....
   })
</script>

顺便说一句，正如我从 Firebug 控制台看到的那样，浏览器仅加载以下网址:

GET /js/require.js
GET /js/main.js
GET /js/loader.js !!! Notice it's loader.js, not loader-min.js
GET /js/backbone-min.js
GET /js/underscore-min.js

因此，对于模块 loader，它会尝试加载文件 loader.js，而不是在 main.js 中配置的路径。未缩小/优化文件，忽略 requirejs.config 值。

最奇怪的是它仍然为 backbone 和 underscore 使用正确的值。大多数情况下，但不是所有时间。有时加载 /js/backbone.js

失败

似乎 RequireJS 在 main.js 完全加载并由浏览器解释之前开始工作。这是预期的行为吗？或者我的应用程序有问题？

我如何确保 requirejs(...) 函数仅在“main.js”被处理后执行？

Answer 1

您的 main.js 文件是异步加载的。但是，此脚本标记(如下)是按顺序解析的。因此无法预测执行顺序(尽管下面的脚本很可能会在异步调用返回之前执行)。

<script type="text/javascript">
   // require() and not requirejs()
   require(['loader'], function(loader) { 
      ....
   })
</script>

像这样在 main.js 文件的末尾添加 require 调用:

require.config({
// configuration.
});

require(['loader'], function(loader) { 
// callback
})

这样 RequireJS 总是在执行任何 require 或 define 调用之前“配置”。

编辑:我通常做的事情:

<script src="/js/require.js"></script> <!-- No data-main attribute -->
<script src="/js/config.js"></script> <!-- Explicitly load configuration -->

<script type="text/javascript">
    require.config({
        baseURL: "path/to/base"
    });
    require(["module"], function(module){
        // code
    });
</script>

这样我就可以明确控制加载的内容。它还使我的 config.js 文件保持干燥。

我通常在我的 bootstrap HTML 中设置 baseURL，因为这样我就可以为我的 Jasmine 测试套件使用相同的配置文件。