When does requireJS require an asynchronous call? When is it in sync?

Question

I am using RequireJS to load my modules into one of my projects. I see around the Internet various ways to require modules by calling require (rather than define ).

Suppose I have a module named "jQuery" and I would like to require it. Two ways are possible, as I saw in the examples:

• It:

   require(["JQuery"], function($){ $.doSomething(); }) 

• And this:

   var $ = require("JQuery"); $.doSomething(); 

My question is that loading is asynchronous, since it requires an ad to be, how does it work, how does the second convention work? How can I say for sure that $ defined and that the first line is completed before the second line is executed?

Answer 1

RequireJS always loads the modules asynchronously, but allows you to see that the require form looks synchronous. Your second snippet is missing some really important code. (In addition, the module name for jQuery is hard-coded in jquery . You can write a configuration that allows you to refer to it as jquery , but it makes no sense.) This form of require calls is intended for use inside modules like this:

 define(function (require) { var $ = require("jquery"); $.doSomething(); }); 

What is necessary to fulfill this requirement using the code above, before you execute it, convert it to it:

 define(['jquery'], function (require) { var $ = require("jquery"); $.doSomething(); }); 

Note the addition of a dependency as the first argument to define . When RequireJS executes the code, it finds a dependency, loads jquery , and then calls an anonymous function. As time has passed, require("jquery") module is already loaded. At the end of the day, when the require call looks synchronous, loading the required module still happens asynchronously.

Can you use this synchronous require form outside of the define call? Only if you're okay with failures. This require call will fail if the module passed to it is not yet loaded. You get a notorious error:

 Module name ... has not been loaded yet for context: ... 

Using this parameter in define , as shown above, is safe. Or I think you could do:

 require(['jquery'], function (require) { var $ = require("jquery"); $.doSomething(); }); 

which will work, but what is the point of manual repetition of the dependency. (If you are wondering, RequireJS does not convert the call to require with a callback, like the one I have in my example here, in the same way that it converts the call to define , as I showed above).

Answer 2

According to the requirements of .js docs this is a shell. Thus, it restores the code to work asynchronously. This is called a CommonJs wrapper. You can find more information about this here.

Answer 3

I do not know requirejs. But I think it is possible to load the module in both the sync and async paths.

 function require(name,cb){ if(cb !== undefined){ requireAsync(name,cb); }else{ requireSync(name); } }