Ten. Million. Questions. Let's celebrate all we've done together.

Take the 2-minute tour ×

Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free.

Require.js Error: Load timeout for modules: backbone,jquerymobile

up vote29down votefavorite

13

I am trying to use r.js to optimize my code but I keep running to this error:

Tracing dependencies for: init

Error: Load timeout for modules: backbone,jquerymobile

The command I am running 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?

javascript jquery backbone.js requirejs

shareimprove this question

edited Jan 11 '13 at 14:51

asked Jan 11 '13 at 14:15 Devin Dixon 2,09083672

I have the same problem , but only happens in chrome , in your case too ? –  Lucas Roselli Jul 15 at 13:52

add a comment

6 Answers

activeoldestvotes

up vote63down vote

Require.js has a Config option called waitSeconds. This may help.

RequireJS waitSeconds

Here's an example where waitSeconds is used:

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

shareimprove this answer

edited Jan 23 '14 at 14:29 hcpl 9,38024050

answered Jan 11 '13 at 17:23 BarDev 4,78184259

1

Thanks! I was having the same problem but I didn't think that it was actually a timeout issue. It must be due to the size or complexity of jQuery because the error only occurs when a dependency is declared on jQuery. Changing waitSeconds to something larger allowed the build to complete successfully. –  Peter RebholzJan 14 '13 at 14:47

1

I can confirm this. We have a bigger project with several dependencies to large libraries. With requireJS 2.0.6, that was fine. requireJS 2.1.4 however runs into the timeout. A higher value for waitSeconds solved it. –  phammer Jan 25 '13 at 11:07

Just opened a pull request to update the build.js example of require.js so that people become faster aware of the parameter. See github.com/jrburke/r.js/pull/362 –  phammer Jan 25 '13 at 11:36

3

Thanks! This helped me. I wonder, are most folks using a non-default value for this property? Is 200 pretty common? What about 0? –  Josh Schultz Feb 12 '13 at 17:00 

2

I also get a timeout in iOS/Safari (and not iOS/Chrome!) when loading the first time after cache is cleared. Backbone views fail to load with timeout. Setting waitSeconds really high does not help. My require() call includes 8 modules, each of which include 2 - 3 of their own modules (some being text! templates). If I reduce the 8 modules to 5, things load fine under iOS/Safari. I've checked the file paths as well as for syntax errors a dozen times. –  Chad Johnson Apr 29 '13 at 17:55 

show 1 more comment

up vote21down vote

The Error

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

I'm using Chrome canary build (Version 34.0.1801.0 canary) but also had a stable version installed (Version 32.0.1700.77) showing the exact same issue when loading the app with Developer console open:

Uncaught Error: Load timeout for modules

The developer console is key here since I didn't get the error when the console wasn't open. I tried resetting all chrome settings, uninstalling any plugin, ... nothing helped so far.

The Solution

The big pointer was a Google group discussion (see resources below) about the waitSeconds config option. Setting that to 0 solved my issue. I wouldn't check this in since this just sets the timeout to infinite. But as a fix during development this is just fine. Example config:

<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>

Most common other causes for this error are:

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

More Resources

Troubleshooting page from requireJS: http://requirejs.org/docs/errors.html#timeout point 2, 3 and 4 can be of interest.

Similar SO question: Ripple - Uncaught Error: Load timeout for modules: app http://requirejs.org/docs/errors.html#timeout

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

shareimprove this answer

answered Jan 23 '14 at 14:29 hcpl 9,38024050

add a comment

up vote6down vote

The default value for waitSeconds = 7 (7 Seconds)

If set to 0, timeout is completely disabled.

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

shareimprove this answer

answered Apr 29 '14 at 15:26 Eduscho 12917

add a comment

up vote6down vote

In case others have this issue and still struggling with it (like I was), this problem can also arise from circular dependencies, e.g. A depends on B, and B depends on A.

The RequireJS docs don't mention that circular dependencies can cause the "Load timeout" error, but I've now observed it for two different circular dependencies.

shareimprove this answer

answered Jul 15 '14 at 17:35 Aaron 3782921

2

How did you go about identifying circular issues? Did you have to go through each defined module? – Paul Redmond Sep 30 '14 at 22:34

My issue came up when I added and changed some modules, so I was able to go through those changes, track down which added dependencies created the circular dependency loop, and remove them. –  Aaron Oct 3 '14 at 20:02

1

xrayquire (a tool by requirejs) can check for circular dependencies –  Druska Jan 28 at 14:51

observed when loading a module A inside a callback function from another module B which required module A –  Jochen Bedersdorfer May 28 at 7:27

add a comment

up vote0down vote

I only get this error when running tests on Mobile Safari 6.0.0 (iOS 6.1.4). waitSeconds: 0 has given me a successful build for now. I'll update if my build fails on this again

shareimprove this answer

answered Aug 15 '14 at 10:35 Adam Spence 59449

thats 2 in a row! –  Adam Spence Aug 15 '14 at 11:09

add a comment

up vote0down vote

check you have done something like this

require(["Q", "jquery"], function (Q, $) {

this should be

require(["q", "jquery"], function (Q, $) {

because we have to load all q js with that name as it's since all module load by q do not enter any reference other than "q" (or name that your q js file.)

shareimprove this answer

answered Jan 19 at 17:10 Prageeth 876920

add a comment

参考:http://stackoverflow.com/questions/14279962/require-js-error-load-timeout-for-modules-backbone-jquerymobile