Require.js Error: load timeout for modules: trunk, jquerymobile

Question

I try to use r.js to optimize my code, but I continue to work with this error:

Dependency Tracking for: init

Error: Load timeout for modules: backbone,jquerymobile 

The command that I run is this:

 $ 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 

My build.js file looks like this:

 ( { //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 }) 

And my init.js looks like this:

  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 }); 

What am I doing wrong in this build process?

Answer 1

Require.js has a Config parameter called waitSeconds. This can help.

RequireJS waitSeconds

Here's an example of using 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); } ); 

Answer 2

Mistake

I recently had a very similar problem with an angularJS project using requireJS .

I am using the Chrome canary assembly ( Version 34.0.1801.0 canary ), but a stable version ( Version 32.0.1700.77 ) was also installed showing the same problem when loading the application using the Developer console open:

 Uncaught Error: Load timeout for modules 

The developer console is key here. since I did not receive an error when the console was not open. I tried to reset all chrome settings, remove any plugin, ... nothing has helped so far.

Decision

The big pointer is a discussion by the Google group (see below) about the waitSeconds config parameter. By installing this, I solved the problem. I would not check this, because it just sets the timeout to infinity. But as a fix during development, this is just fine. Configuration Example :

 <script src="scripts/require.js"></script> <script> require.config({ baseUrl: "/another/path", paths: { "some": "some/v1.0" }, waitSeconds: 0 }); require( ["some/module", "my/module", "a.js", "b.js"], function(someModule, myModule) { //This function will be called when all the dependencies //listed above are loaded. Note that this function could //be called before the page is loaded. //This callback is optional. } ); </script> 

The most common causes of this error are:

• errors in modules
• wrong paths in the configuration (check the paths and baseUrl )
• double entry in config

Additional resources

The troubleshooting page from requireJS: http://requirejs.org/docs/errors.html#timeout may be of interest 2, 3, and 4.

A similar SO question: Ripple - Crash error: load time for modules: application http://requirejs.org/docs/errors.html#timeout

A discussion of related Google groups: https://groups.google.com/forum/#!topic/requirejs/70HQXxNylYg

Answer 3

In case others have this problem and are still struggling with it (like me), this problem can also arise from circular dependencies, for example. A depends on B, and B depends on A.

RequireJS docs do not mention that circular dependencies can cause a "load timeout" error, but now I have observed it for two different circular dependencies.

Answer 4

The default value for waitSeconds = 7 (7 seconds)

If set to 0, the timeout is completely disabled.

src: http://requirejs.org/docs/api.html

Answer 5

The reason for this problem is that Require.js starts in timeout, as the project may have dependencies on large libraries. The default timeout is 7 seconds. Increasing the value for this configuration parameter (called waitSeconds) solves it, of course, but this is the wrong approach. The right approach is to improve page load time . One of the best technologies for speeding up page loading is minification , a code compression process. There are some good minimization tools like r.js or webpack .

Answer 6

I get this error only when running tests on Mobile Safari 6.0.0 (iOS 6.1.4). waitSeconds: 0 gave me a successful build at the moment. I will update if my build fails again