javascript RequireJS: 模块名称 __ 尚未为上下文加载，但仅适用于某些，而不是全部
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21420449/
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
RequireJS: Module name __ has not been loaded yet for context, but only for SOME, not all
提问by Katie
Now I know this question has been asked a million times before, but I still couldn't figure it out.
现在我知道这个问题已经被问过一百万次了，但我仍然无法弄清楚。
I have a huge amount of "defines" in various files. Most the time, this works, but a few of my modules are "not loaded for context"sometimes, even-though I put their names in the "define" statement.
我在各种文件中有大量的“定义”。大多数情况下，这是有效的，但有时我的一些模块“未加载上下文”，即使我将它们的名称放在“定义”语句中。
===========================
============================
Current Code
当前代码
index.js (Simplified for StackOverflow)
index.js（为 StackOverflow 简化）
require.config({
baseUrl: '',
paths: {
//TOOLS
jquery: '../libraries/jquery-1.10.2.min',
socketio:'socket.io/socket.io',
jqueryLightBox:'../libraries/jquery.lightbox_me',
jqueryMigrate:'../libraries/jquery-migrate-1.2.1',
jqueryUI:'../libraries/jquery-ui-1.10.3.custom.min',
spinner:'../libraries/jquery.spin',
jQueryFormPlugin:'../libraries/jquery.form.min',
jQueryCookiePlugin:'../libraries/jquery.cookie',
json2:'../libraries/json2',
raphael:'../libraries/raphael-min',
raphaelPanZoom:'../libraries/raphael.pan-zoom.min',
bootstrap: '../libraries/bootstrap.min',
browserDetection: '../libraries/BrowserDetect',
qtip: '../libraries/jquery.qtip.min',
imagesloaded: '../libraries/imagesloaded.pkgd.min',
eventie: '../libraries/eventie',
eventEmitter: '../libraries/EventEmitter.min',
underscore: '../libraries/underscore-min',
underscoreString: '../libraries/underscore.string.min',
stacktrace: '../libraries/stacktrace',
elapseMeMin: '../libraries/elapseMe.min',
jqueryKeithWood: '../libraries/jquery.svg.min',
domReady: '../libraries/domReady',
//PAGES: (Simplified for StackOverflow)
TestView: '../javascripts/tests/TestView',
TestModel: '../javascripts/tests/TestModel',
TestController: '../javascripts/tests/TestController',
TestPanelView: '../javascripts/tests/Test-StartPanelView',
SocketLogic: '../javascripts/SocketLogic',
Logger: '../javascripts/Logger',
},
shim: {
'socketio': {
exports: 'io'
},
'spinner': {
exports: 'Spinner',
deps: ['jquery']
},
'raphael': {
exports: 'Raphael',
deps: ['jquery']
},
'raphaelPanZoom': {
deps: ['raphael']
},
'bootstrap': {},
'browserDetection': {
exports: 'BrowserDetect'
},
'underscore': {
exports: '_'
},
'underscoreString': {
deps: ['underscore'],
exports: '_'
},
'stacktrace': {
exports: 'printStackTrace'
},
'elapseMeMin': {
exports: 'elapseMe',
deps: ['jquery']
}
}
});
//////////////////
//1) Everything starts with this method. Will execute when the DOM is ready.
/////////////////
require(['domReady'], function (domReady) {
domReady(function () {
//This function is called once the DOM is ready.
//It will be safe to query the DOM and manipulate
//DOM nodes in this function.
//Start Loading!
require(['TestController'], function(TestController)
{
TestController.firstMethod();
});
});
});
TestController.js(Simplified for StackOverflow)
TestController.js（为 StackOverflow 简化）
define(['TestModel', 'TestView', 'SocketLogic', 'Logger', 'TestPanelView'],
function (TestModel, TestView, socketLogic, Logger, TestPanelView)
{
return {
firstMethod: function()
{
TestModel.doSomething();
TestView.doSomethingElse();
socketLogic.andAnother();
Logger.log("hi");
TestPanelView.updateSomething();
this.anotherMethod();
},
anotherMethod: function()
{
console.log("hello");
}
}
});
===========================
============================
Problem
问题
But, once in a while, I'll randomly get just one of themto "not be loaded for context", eventhough the rest were just fine:
但是，偶尔，我会随机得到其中只有一个以“无法加载上下文”沉绵其余均只是罚款：
Uncaught Error: Module name "TestPanelView" has not been loaded yet for context: _
http://requirejs.org/docs/errors.html#notloaded
===========================
============================
Current Fixes
当前修复
Fix #1 - Using require('');
修复 #1 - 使用 require('');
Instead of
代替
TestPanelView.updateSomething();
I have been doing:
我一直在做：
var testPanelView = require('TestPanelView');
testPanelView.updateSomething();
Which works, BUT.. shouldn't it have alreadybeen loaded into contextsince I put it in the header? Why this one? It's the same as all the others!
哪个有效，但是……自从我把它放在标题中后，它不应该已经加载到上下文中了吗？为什么是这个？这和其他人一样！
Fix #2 - Using require([''],function(){});
修复 #2 - 使用 require([''],function(){});
This also works, but again I'm just doing this one by one and it feels wrong!
这也有效，但我只是一个一个地这样做，感觉不对！
Instead of
代替
TestPanelView.updateSomething();
Sometimes I do this:
有时我这样做：
require(['TestPanelView'], function(testPanelView){
testPanelView.updateSomething();
});
Failed Attempts #1
失败的尝试 #1
TestController.js(Simplified for StackOverflow)
TestController.js（为 StackOverflow 简化）
define(['require', 'TestModel', 'TestView', 'SocketLogic', 'Logger', 'TestPanelView'],
function (require)
{
var TestModel = require('TestModel')
var TestView = require('TestView');
var SocketLogic = require('SocketLogic');
var Logger = require('Logger');
var TestPanelView = require('TestPanelView');
return {
firstMethod: function()
{
TestModel.doSomething();
TestView.doSomethingElse();
SocketLogic.andAnother();
Logger.log("hi");
TestPanelView.updateSomething();
this.anotherMethod();
},
anotherMethod: function()
{
console.log("hello");
}
}
});
Here I get the "not loaded for context"error again, but this time for all of them.
在这里，我再次收到“未加载上下文”错误，但这次是针对所有这些错误。
===========================
============================
Ideas?
想法？
I've been manually patching each one that I find like this, which is not happening to all, only some here and there, which feels like monkey patching... I'd like to know what I'm doing wrong here :( Anyone know?
我一直在手动修补我发现的每个这样的问题，这不会发生在所有情况下，只有一些地方和那里，感觉就像猴子修补......我想知道我在这里做错了什么:(有人知道吗？
Note: I'm using RequireJS v.2.1.10
注意：我使用的是 RequireJS v.2.1.10
回答by Steven Spyrka
Answer to failed attempt #1
对失败尝试 #1 的回答
define(['require', 'TestModel', 'TestView', 'SocketLogic', 'Logger', 'TestPanelView'],
function (require, testModel, testView, socketLogic, logger, testPanelView) {
var firstMethod = function() {
testModel.doSomething();
testView.doSomethingElse();
socketLogic.andAnother();
logger.log("hi");
testPanelView.updateSomething();
this.anotherMethod();
};
var anotherMethod = function(){
console.log("hello");
}
return {
firstMethod: firstMethod,
anotherMethod: anotherMethod
});
And don't forget, the opening curly bracket must come after the ending round bracket of the function in the same line.
并且不要忘记，开始的大括号必须在同一行中函数的结束圆括号之后。
