Javascript Require.js错误:模块的加载超时:主干,jquerymobile
我试图使用r.js优化我的代码,但我一直运行到这个错误: 跟踪:init的依赖项Javascript Require.js错误:模块的加载超时:主干,jquerymobile,javascript,jquery,backbone.js,requirejs,Javascript,Jquery,Backbone.js,Requirejs,我试图使用r.js优化我的代码,但我一直运行到这个错误: 跟踪:init的依赖项 Error: Load timeout for modules: backbone,jquerymobile 我正在运行的命令如下: $ java -classpath /Users/dixond/build-tools/rhino1_7R4/js.jar:/Users/dixond/build-tools/closurecompiler/compiler.jar org.mozilla.javascript.t
Error: Load timeout for modules: backbone,jquerymobile
我正在运行的命令如下:
$ java -classpath /Users/dixond/build-tools/rhino1_7R4/js.jar:/Users/dixond/build-tools/closurecompiler/compiler.jar org.mozilla.javascript.tools.shell.Main /Users/dixond/build-tools/r.js/dist/r.js -o /Users/dixond/Sites/omm_mobile/js/build.js
我的build.js文件如下所示:
( {
//appDir: "some/path/",
baseUrl : ".",
mainConfigFile : 'init.js',
paths : {
jquery : 'libs/jquery-1.8.3.min',
backbone : 'libs/backbone.0.9.9',
underscore : 'libs/underscore-1.4.3',
json2 : 'libs/json2',
jquerymobile : 'libs/jquery.mobile-1.2.0.min'
},
packages : [],
shim : {
jquery : {
exports : 'jQuery'
},
jquerymobile : {
deps : ['jquery'],
exports : 'jQuery.mobile'
},
underscore : {
exports : '_'
},
backbone : {
deps : ['jquerymobile', 'jquery', 'underscore'],
exports : 'Backbone'
}
},
keepBuildDir : true,
locale : "en-us",
optimize : "closure",
skipDirOptimize : false,
generateSourceMaps : false,
normalizeDirDefines : "skip",
uglify : {
toplevel : true,
ascii_only : true,
beautify : true,
max_line_length : 1000,
defines : {
DEBUG : ['name', 'false']
},
no_mangle : true
},
uglify2 : {},
closure : {
CompilerOptions : {},
CompilationLevel : 'SIMPLE_OPTIMIZATIONS',
loggingLevel : 'WARNING'
},
cssImportIgnore : null,
inlineText : true,
useStrict : false,
pragmas : {
fooExclude : true
},
pragmasOnSave : {
//Just an example
excludeCoffeeScript : true
},
has : {
'function-bind' : true,
'string-trim' : false
},
hasOnSave : {
'function-bind' : true,
'string-trim' : false
},
//namespace: 'foo',
skipPragmas : false,
skipModuleInsertion : false,
optimizeAllPluginResources : false,
findNestedDependencies : false,
removeCombined : false,
name : "init",
out : "main-built.js",
wrap : {
start : "(function() {",
end : "}());"
},
preserveLicenseComments : true,
logLevel : 0,
cjsTranslate : true,
useSourceUrl : true
})
requirejs.config({
//libraries
paths: {
jquery: 'libs/jquery-1.8.3.min',
backbone: 'libs/backbone.0.9.9',
underscore: 'libs/underscore-1.4.3',
json2 : 'libs/json2',
jquerymobile: 'libs/jquery.mobile-1.2.0.min'
},
//shimming enables loading non-AMD modules
//define dependencies and an export object
shim: {
jquerymobile: {
deps: ['jquery'],
exports: 'jQuery.mobile'
},
underscore: {
exports: '_'
},
backbone: {
deps: ['jquerymobile', 'jquery', 'underscore', 'json2'],
exports: 'Backbone'
}
}
});
requirejs(["backbone",], function(Backbone) {
//Execute code here
});
我的init.js如下所示:
( {
//appDir: "some/path/",
baseUrl : ".",
mainConfigFile : 'init.js',
paths : {
jquery : 'libs/jquery-1.8.3.min',
backbone : 'libs/backbone.0.9.9',
underscore : 'libs/underscore-1.4.3',
json2 : 'libs/json2',
jquerymobile : 'libs/jquery.mobile-1.2.0.min'
},
packages : [],
shim : {
jquery : {
exports : 'jQuery'
},
jquerymobile : {
deps : ['jquery'],
exports : 'jQuery.mobile'
},
underscore : {
exports : '_'
},
backbone : {
deps : ['jquerymobile', 'jquery', 'underscore'],
exports : 'Backbone'
}
},
keepBuildDir : true,
locale : "en-us",
optimize : "closure",
skipDirOptimize : false,
generateSourceMaps : false,
normalizeDirDefines : "skip",
uglify : {
toplevel : true,
ascii_only : true,
beautify : true,
max_line_length : 1000,
defines : {
DEBUG : ['name', 'false']
},
no_mangle : true
},
uglify2 : {},
closure : {
CompilerOptions : {},
CompilationLevel : 'SIMPLE_OPTIMIZATIONS',
loggingLevel : 'WARNING'
},
cssImportIgnore : null,
inlineText : true,
useStrict : false,
pragmas : {
fooExclude : true
},
pragmasOnSave : {
//Just an example
excludeCoffeeScript : true
},
has : {
'function-bind' : true,
'string-trim' : false
},
hasOnSave : {
'function-bind' : true,
'string-trim' : false
},
//namespace: 'foo',
skipPragmas : false,
skipModuleInsertion : false,
optimizeAllPluginResources : false,
findNestedDependencies : false,
removeCombined : false,
name : "init",
out : "main-built.js",
wrap : {
start : "(function() {",
end : "}());"
},
preserveLicenseComments : true,
logLevel : 0,
cjsTranslate : true,
useSourceUrl : true
})
requirejs.config({
//libraries
paths: {
jquery: 'libs/jquery-1.8.3.min',
backbone: 'libs/backbone.0.9.9',
underscore: 'libs/underscore-1.4.3',
json2 : 'libs/json2',
jquerymobile: 'libs/jquery.mobile-1.2.0.min'
},
//shimming enables loading non-AMD modules
//define dependencies and an export object
shim: {
jquerymobile: {
deps: ['jquery'],
exports: 'jQuery.mobile'
},
underscore: {
exports: '_'
},
backbone: {
deps: ['jquerymobile', 'jquery', 'underscore', 'json2'],
exports: 'Backbone'
}
}
});
requirejs(["backbone",], function(Backbone) {
//Execute code here
});
在这个构建过程中我做错了什么?Require.js有一个名为waitSeconds的配置选项。这可能会有所帮助 以下是使用waitSeconds的示例:
requirejs.config({
baseUrl: "scripts",
enforceDefine: true,
urlArgs: "bust=" + (new Date()).getTime(),
waitSeconds: 200,
paths: {
"jquery": "libs/jquery-1.8.3",
"underscore": "libs/underscore",
"backbone": "libs/backbone"
},
shim: {
"underscore": {
deps: [],
exports: "_"
},
"backbone": {
deps: ["jquery", "underscore"],
exports: "Backbone"
},
}
});
define(["jquery", "underscore", "backbone"],
function ($, _, Backbone) {
console.log("Test output");
console.log("$: " + typeof $);
console.log("_: " + typeof _);
console.log("Backbone: " + typeof Backbone);
}
);
错误
我最近在使用requireJS
的angularJS
项目中遇到了一个非常类似的问题
我使用的是Chrome canary build(Version34.0.1801.0 canary
),但也安装了一个稳定的版本(Version32.0.1700.77
),当在开发者控制台打开的情况下加载应用程序时,显示了完全相同的问题:
Uncaught Error: Load timeout for modules
开发者控制台在这里很关键,因为我没有在控制台未打开时收到错误。我尝试重置所有chrome设置,卸载任何插件。。。到目前为止没有任何帮助
解决方案
最大的问题是关于waitSeconds
config选项的谷歌小组讨论(见下面的参考资料)。将其设置为0解决了我的问题。我不会签入它,因为这只是将超时设置为无限。但作为开发过程中的修复,这很好
require.config({
baseUrl:“/other/path”,
路径:{
“some”:“some/v1.0”
},
等待秒:0
});
require([“some/module”、“my/module”、“a.js”、“b.js”],
函数(someModule,myModule){
//当所有依赖项
//上面列出的已加载。请注意,此函数可能会
//在加载页面之前调用。
//此回调是可选的。
}
);
此错误最常见的其他原因有:
- 模块中的错误
- 配置中的路径错误(选中
路径
和基本URL
选项)
- 配置中的双条目
更多资源
requireJS中的疑难解答页面:第2点、第3点和第4点可能很有趣
类似问题:
相关的Google群组讨论:waitSeconds的默认值=7(7秒)
如果设置为0,则完全禁用超时
src:如果其他人有这个问题,但仍在努力解决(像我一样),这个问题也可能由循环依赖性引起,例如A依赖于B,B依赖于A
不要提及循环依赖可能会导致“加载超时”错误,但我现在观察到两种不同的循环依赖。我只有在Mobile Safari 6.0.0(iOS 6.1.4)上运行测试时才会出现此错误waitSeconds:0
为我提供了一个成功的构建。如果我的构建再次失败,我将进行更新。问题的原因是Require.js运行到超时,因为项目可能依赖于大型库。默认超时为7秒。增加此配置选项的值(称为waitSeconds)当然可以解决此问题,但这不是正确的方法。
正确的方法是提高页面加载时间。加速页面加载的最佳技术之一是缩小,即压缩代码的过程。有一些很好的缩小工具,比如or TLDR:
要求同一文件两次使用两个有效的不同名称,可能是以下两个:
- 绝对路径:'/path/to/file.js'
- 相对路径:'./path/to/file.js'
- 作为模块:“path/to/file”
- 作为主路径配置上的模块:
路径:{
“my/module/file”:“/path/to/file”
}
最近也有同样的问题。我确实批量更改了一些require路径,所以我知道问题就在于此
我可以在服务器端日志和网络调试选项卡上清楚地看到在不到一秒钟的时间内提供的文件。这不是一个真正的超时问题
我尝试按建议使用查找任何循环依赖项,但没有成功。我查找了冲突文件的需求,发现我需要两次不同名称的文件。谢谢!我也有同样的问题,但我不认为这实际上是一个超时问题。这一定是由于jQuery的大小或复杂性造成的,因为只有在jQuery上声明依赖项时才会发生错误。将waitSeconds
更改为更大的值可以成功完成构建。我可以确认这一点。我们有一个更大的项目,有几个依赖于大型库。对于RequireJS2.0.6,这很好。但是,requireJS 2.1.4会运行到超时。waitSeconds
的一个更高的值解决了这个问题。刚刚打开了一个pull请求来更新require.js的build.js示例,以便人们更快地了解该参数。看,谢谢!这对我有帮助。我想知道,大多数人对这个属性使用非默认值吗?200美元相当普遍吗?0呢?在清除缓存后第一次加载时,iOS/Safari(而不是iOS/Chrome!)中也会出现超时。主干视图加载失败,超时。将waitSeconds设置得非常高并没有帮助。我的require()调用包括8个模块,每个模块都包含2-3个自己的模块(有些是文本模板)。如果我将8个模块减少到5个,那么在iOS/Safari下可以正常加载。我已经检查了十几次文件路径和语法错误。您是如何确定循环问题的?您必须检查每个定义的模块吗?我的问题是在添加和更改一些模块时出现的,因此我能够检查这些更改,跟踪哪些添加的依赖项创建了循环依赖项循环,并将其删除。(requirejs提供的工具)可以检查从另一个模块B在回调函数中加载模块a时观察到的循环依赖性,该模块要求模块AI具有相同的问题,但只有h