CODEWITHSUNDEEP
jquerybackbone.jsunderscore.jsrequirejs
Johannes Degn
Johannes Degn

Reputation: 287

RequireJS and text plugin Load timeout for modules

I am having some problems getting the RequireJS text plugin to work. This is possibly a path related issue (or something similarly obvious) but I can't solve it because neither the chrome console (with xhr turned on) nor firebug is giving me any info other than 

Uncaught Error: Load timeout for modules: text 
http://requirejs.org/docs/errors.html#timeout

I am quite sure that the paths are OK but I cant find any other explanation. Does somebody have an idea how to debug this?

I am using node.js and express on the server side and backbone and jQuery on the client end. All of these get loaded correctly with RequireJS.

Upvotes: 15

Views: 10144

Answers (5)

Nate Anderson
Nate Anderson

Reputation: 21084

Require.js made a request for my text.js file, but the response was a 302 - my user was not authenticated. Therefore, text plugin couldn't load. Therefore all my text resources failed to load: text!any/name.html.

My console gave me a related message, another hint that my text plugin couldn't load:

Cannot read property 'normalize' of undefined

Upvotes: 0

Hans Cappelle
Hans Cappelle

Reputation: 17495

My original answer

I answered a similar question here pointing to the official require.js troubleshooting pages.

In my case this error only occurred when the developer console was open on chrome for several chrome versions on a single macbook. Other devices didn't show the problem. Because of this I was OK by changing the config on that single computer.

waitSeconds

The waitSeconds option can be configured as infinite (0) or any value you want (in seconds). The default value is 7 seconds. An 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>

Since infinite (0) disables the timeout I would not recommend this option for production code! If you encounter this problem running your code anywhere or disabling the timeout doesn't help then keep on reading.

3 common causes for this issue

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

For more on this topic check the original answer linked on top.

Upvotes: 1

Zachary Schuessler
Zachary Schuessler

Reputation: 3682

I got this error when incorrectly using the syntax sugar. You can't both define dependencies and use the require factory function.

//THIS WILL FAIL
define(['require'], function (require) {
    var namedModule = require('name');
});

From the documentation:

This fails because requirejs needs to be sure to load and execute all dependencies before calling the factory function above. If a dependency array is given to define(), then requirejs assumes that all dependencies are listed in that array, and it will not scan the factory function for other dependencies. So, either do not pass in the dependency array, or if using the dependency array, list all the dependencies in it.

So if you specify a dependency array, you can't also depend on the sugar syntax to work. Not ideal in my opinion, but that's how requirejs was created to function.

Upvotes: 0

Simon Boudrias
Simon Boudrias

Reputation: 44609

As it's on your windows phone, try to set "waitSeconds" to a higher number.

Mobile are slow, but require.js will timeout after 7 seconds by default, which is often way to low for mobile experience / or user with slow internet access.

doc: http://requirejs.org/docs/api.html#config-waitSeconds

Upvotes: 1

swatkins
swatkins

Reputation: 13630

I'm guessing it's a path issue. I have the same setup (node/express and backbone) and it seems to be working for me. Here is my main.js file:

require.config({
  paths: {
    jquery: 'libs/jquery-1.7.1.min',
    underscore: 'libs/underscore',
    backbone: 'libs/backbone',
    text: 'libs/text',
    templates: '../views',
    persist: 'libs/persist/persist'
  }
});
require([
  'app'
], function(App){
  App.initialize();
});

and here is how I call the plugin from within a module:

define([
  'jquery',
  'underscore',
  'backbone',
  'collections/sub_elements',
  'collections/elements',
  'views/element',
  'text!../../../views/partials/_elements.html'
], function($, _, Backbone, sub_elementsCollection, collection, view,     template){

  var elementsView = Backbone.View.extend({
    // ... //
  });

  return elementsView;
});

Upvotes: 4

Related Questions