javascript Require JS 忽略我的配置
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17341015/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Require JS is ignoring my config
提问by Andrejs Kuzmins
I'm having pretty simple directory structure for scripts:
我的脚本目录结构非常简单：
/js/ <-- located in site root
libs/
jquery-1.10.1.min.js
knockout-2.2.1.js
knockout.mapping.js
models/
model-one.js
model-two.js
...
require.js
config.js
Since the site engine uses clean URLs I'm using absolute paths in <script>:
由于站点引擎使用干净的 URL，我在以下位置使用绝对路径<script>：
<script type="text/javascript" data-main="/js/config.js" src="/js/require.js"></script>
RequireJS config:
RequireJS 配置：
requirejs.config({
baseUrl: "/js/libs",
paths: {
"jquery": "jquery-1.10.1.min",
"knockout": "knockout-2.2.1",
"komapping": "knockout.mapping"
}
});
Somewhere in HTML:
HTML 中的某处：
require(["jquery", "knockout", "komapping"], function($, ko, mapping){
// ...
});
So the problem is that RequireJS completely ignores baseUrland pathsdefined in config file. I get 404 error for every module required in the code below. I see in browser console that RequireJS tries to load these modules from /js/without any path translations:
所以问题是RequireJS完全忽略baseUrl并paths在配置文件中定义。对于下面代码中所需的每个模块，我都会收到 404 错误。我在浏览器控制台中看到 RequireJS 尝试从/js/没有任何路径转换的情况下加载这些模块：
404: http://localhost/js/jquery.js
404: http://localhost/js/knockout.js
404: http://localhost/js/komapping.js
However after the page is loaded and the errors are shown I type in console and...
但是，在页面加载并显示错误后，我在控制台中输入并...
> require.toUrl("jquery")
"/js/libs/jquery-1.10.1.min"
Why so? How to solve this problem?
为什么这样？如何解决这个问题呢？
It's my first experience using RequireJS, so I'm feeling like I've skipped something very simple and obvious. Help, please.
这是我第一次使用 RequireJS，所以我觉得我跳过了一些非常简单和明显的东西。请帮忙。
Update
更新
Just discovered this question: Require.js ignoring baseUrl
刚刚发现这个问题：Require.js ignoring baseUrl
It's definitely my case. I see in my Network panel that config.jsis not completely loaded before require(...)fires own dependency loading.
这绝对是我的情况。我在我的网络面板中看到在触发自己的依赖项config.js加载之前没有完全加载require(...)。
But I don't want to place my require(...)in config because it is very specific for the page that calls it. I've never noticed such problem with asynchronicity in any example seen before. How do authors of these examples keep them working?
但是我不想将我require(...)的配置放在 config 中，因为它对于调用它的页面非常具体。在之前看到的任何示例中，我从未注意到此类异步问题。这些示例的作者如何让它们继续工作？
回答by Andrejs Kuzmins
Solved.
解决了。
The problem was that config file defined in data-mainattribute is loaded asynchronously just like other dependencies. So my config.jsaccidentally was never completely loaded and executed before requirecall.
问题是data-main属性中定义的配置文件是异步加载的，就像其他依赖项一样。所以我config.js不小心在require调用之前从未完全加载和执行。
The solution is described in official RequireJS API: http://requirejs.org/docs/api.html#config
官方 RequireJS API 中描述了解决方案：http://requirejs.org/docs/api.html#config
... Also, you can define the config object as the global variable require before require.js is loaded, and have the values applied automatically.
...此外，您可以在加载 require.js 之前将配置对象定义为全局变量 require，并自动应用这些值。
So I've just changed my config.jsto define global requirehash with proper configuration:
所以我刚刚改变了我config.js的定义全局require散列与适当的配置：
var require = {
baseUrl: "/js/libs",
paths: {
"jquery": "jquery-1.10.1.min",
"knockout": "knockout-2.2.1",
"komapping": "knockout.mapping"
}
};
and included it just BEFORE require.js:
并在之前包含它require.js：
<script type="text/javascript" src="/js/config.js"></script>
<script type="text/javascript" src="/js/require.js"></script>
This approach allows to control script execution order, so config.jswill always be loaded before next requirecalls.
这种方法允许控制脚本执行顺序，因此config.js将始终在下次require调用之前加载。
All works perfectly now.
现在一切正常。
回答by Leon
Fixed the issue.
修复了问题。
My config was being loaded asynchronously, and therefore the config paths weren't set before my require statement was being called.
我的配置是异步加载的，因此在调用我的 require 语句之前没有设置配置路径。
As per the RequireJS docs Link here, I added a script call to my config before the require.js call. And removed the data-main attribute.
根据此处的 RequireJS 文档链接，我在 require.js 调用之前向我的配置添加了一个脚本调用。并删除了 data-main 属性。
var require = {
baseUrl: '/js',
paths: {
'jquery': 'vendor/jquery/jquery-2.0.3.min',
'picker': 'vendor/pickadate/picker.min',
'pickadate': 'vendor/pickadate/picker.date.min'
},
shim: {
'jquery': {
exports: '$'
},
'picker': ['jquery'],
'pickadate': {
deps: ['jquery', 'picker'],
exports: 'DatePicker'
}
}
}
All is now working
现在一切正常
