Requirejs is a modular loading framework that follows the AMD specification
As with Seajs above, here is a brief introduction to its related usage
Again, the first thing is to download the Require.js--and Http://requirejs.org/docs/download.html#requirejs.
The AMD specification is pre-loaded, which means that all modules are loaded immediately.
The notation is similar to SEAJS, except that the module name is typically placed in the first parameter when it is necessary to include a module. And not directly require see
(The new version also has the CMD version require contains the way to rely, but the essence is still the same, the following will be mentioned)
Or an example:
Directory structure Sibling
Index.html:
Notice that the script tag here has a Data-main attribute (plus no suffix js can), which identifies the reference main module entry Main.js
(You can also not use this kind of reference entry method, below will introduce another way, notice ~)
<!DOCTYPE HTML><HTML><Head> <title>Require</title> <styletype= "Text/css"> </style></Head><Body><Scripttype= "Text/javascript"Data-main= ' main 'src= "./require.js"></Script></Script></Body></HTML>
Main.js:
Place two modules into parameter 1 and pass in as callback
define ([' main1 ', ' main2 '],function(main1,main2) { console.log (' module of Main: '); Main1.say (); Main2.say ();});
Main1.js:
Define (function(require,exports,module) { console.log (' module of main1: '); = { function() { console.log (' Main1--hello '); } };});
Main2.js:
Define (function(require,exports,module) { console.log (' module of main2: '); return { function() { console.log (' Main2--hello '); } };});
The browser opens index.html to discover the results:
It's a messy order, isn't it?
In fact, this is because the AMD specification pre-loaded rules, pre-all dependencies are executed (although we do not have to use)
And this load is parallel, (by default) Main1 and main2 are not sequential.
Assuming that the Main.js file is delayed due to network problems, the following results may occur
Module of Main2:
Module of Main1:
Module of main:
...
However, we can also for its dependencies, such as main1 rely on main2, then can guarantee the "so-called order"-main2 before the Main1
such as changing index.html to
<!DOCTYPE HTML><HTML><Head> <title>Require</title> <styletype= "Text/css"> </style></Head><Body><Scripttype= "Text/javascript"src= "./require.js"></Script><Scripttype= "Text/javascript">require.config ({shim:{'main1': {deps: ['main2'] } } }); Require (['Main'],function(Main) {Console.log (main.num); });</Script></Script></Body></HTML>
Main.js:
define ([' main1 ', ' main2 '],function(main1,main2) { console.log (' module of Main: '); Main1.say (); Main2.say (); return {Num:10};});
At this point the result:
As mentioned above, Requirejs also updated the policy of following the CMD specification, but ostensibly followed, essentially, AMD's
Why do you say that? Citation
So use Requirejs to be honest with AMD, if you want to use the way of CMD, use Seajs Bar
REQUIREJS Modular Loading Framework uses