if you have a RequireJS module like so:
define(
[
'#patches',
'backbone',
'underscore',
'react',
'#allCollections',
'#allModels',
'app/js/routers/router',
'#allTemplates',
'#allControllers',
'#allRelViews'
],
function(){
var patches = arguments[0];
});
is there any way to know which dependency gets loaded first? In my case, '#patches' is a few window.X utility functions that I want to load before anything else. Do I need to configure this a different way to ensure this?
(in my case "#' is just my own notation to denote a module whose path is predefined in my main config file)
if you have a RequireJS module like so:
define(
[
'#patches',
'backbone',
'underscore',
'react',
'#allCollections',
'#allModels',
'app/js/routers/router',
'#allTemplates',
'#allControllers',
'#allRelViews'
],
function(){
var patches = arguments[0];
});
is there any way to know which dependency gets loaded first? In my case, '#patches' is a few window.X utility functions that I want to load before anything else. Do I need to configure this a different way to ensure this?
(in my case "#' is just my own notation to denote a module whose path is predefined in my main config file)
Share Improve this question edited Jun 16, 2016 at 18:17 Alexander Mills asked Aug 7, 2015 at 1:37 Alexander MillsAlexander Mills 100k165 gold badges531 silver badges908 bronze badges 6 | Show 1 more comment1 Answer
Reset to default 17From the documentation : http://requirejs.org/docs/api.html#mechanics
"RequireJS waits for all dependencies to load, figures out the right order in which to call the functions that define the modules, then calls the module definition functions once the dependencies for those functions have been called. Note that the dependencies for a given module definition function could be called in any order, due to their sub-dependency relationships and network load order."
I think this may help: http://www.sitepoint.com/understanding-requirejs-for-effective-javascript-module-loading/ (see "Managing the Order of Dependent Files")
RequireJS uses Asynchronous Module Loading (AMD) for loading files. Each dependent module will start loading through asynchronous requests in the given order. Even though the file order is considered, we cannot guarantee that the first file is loaded before the second file due to the asynchronous nature. So, RequireJS allows us to use the shim config to define the sequence of files which need to be loaded in correct order. Let’s see how we can create configuration options in RequireJS.
requirejs.config({
shim: {
'source1': ['dependency1','dependency2'],
'source2': ['source1']
}
});
Hope it helps
EDIT: As said in comments, using Shim for AMD module is a bad idea, use only shim for non AMD modules and manage dependencies order there. For AMD module requirejs will manage the order of loading. A good link from the comments (thanks Daniel Tulp) ==> Requirejs why and when to use shim config
#allRelViews
needs the window utilities it should state this in it'sdefine
call. If you're not in control of the dependency I would suggest you use the shim approach that has been suggested in the accepted answer - the only other way I see is to modify the source, but you would have to do this for every update of the library. – mfeineis Commented Aug 7, 2015 at 8:11define
.) If your own modules also calldefine
, then most of the modules you show in your question cannot be used with the answer you accepted becauseshim
has a defined behavior only for non-AMD modules. If you useshim
for a module that callsdefine
, the results are undefined. (When I tried it, it was usually ignored but since there are no semantics to it, RequireJS is free to change what it does from one release to the next. It's like an uninitialized pointer in C: there's no guaranteed what value it gets.) – Louis Commented Aug 9, 2016 at 15:05require('x', function(x){ require('y', function(){ require('z', function(z){})})})
– Alexander Mills Commented Jul 31, 2017 at 7:12