Above release is the execution command node R.js-o build.js generated, you need to switch to the directory Require/tools below, that is, r.js and build.js directories to execute the command
The code directory is as follows:
The main.html code is as follows:
<! DOCTYPE html>/* If no configuration information is available, load the One,two module to find their storage path */* require (["./js/mod/one", "./js/mod/two"], function (one, and both) { Console.log (' Load module: ', One.name, two.name); Console.log ("Bootstrap the Application"); }); */require (["One", "one", "one", "one", "one", "one") {Console.log (' Load module: ', One.name, two.name); Console.log ("Bootstrap the Application"); }); </script> </body>The Config.js code below, configuration information, facilitates the require introduction of these modules One,two,three, such as the above code
Requirejs simple configuration, more detailed configuration information see Http://requirejs.org/docs/api.html#configrequirejs.config ({ baseUrl: "./js",// Path paths relative to the current HTML : {One : "Mod/one", "One" : "Mod/two", Three: "Mod/three" });
One module code:
Define (function () { return {name: "One"}});
Two module code: One module introduces the three module
Define (function (require) { /*var three = require ('./three '); */ var three = require (' three '); Console.log (' Load module: ' +three.name); return {name: "both"}});
Three module code:
Define (function () { return {name: "three"}});
Build.js is the basis for R.js compression code, as follows:
({ appdir: ".) /src ", dir:". /release ", mainconfigfile:". /src/js/config.js ", paths:{one :" Mod/one "," one ":" mod/two ", Three:" Mod/three " }, modules:[{ Name: "Combine", include:[ ' one ', ' both ' ] }], optimize: "Uglify" })
Appdir
The top-level directory of the application. Optionally, if set, R.js will assume that the script is in a subdirectory of this path and that the application's files are copied to the output directory (the path defined by dir). If not set, the following BASEURL path is used.
BaseUrl
By default, all modules are relative to this path. If not set, the module is loaded relative to the directory where the build file resides. In addition, if Appdir is set, the BASEURL should be defined as a path relative to Appdir.
Dir
The path to the output directory. If not set, the default is the build directory with the build file sibling.
Optimize
How JavaScript code is optimized. Values that can be set:
- "Uglify: Use UGLIFYJS compression code, default value;
- "Uglify2": Use the 2.1.2+ version to compress;
- "Closure": Use Google's closure Compiler to compress and merge, need the Java environment;
- "Closure.keeplines": Compress merge with closure Compiler and keep line wrapping;
- "None": Do not compress merge;
Optimizecss
CSS code optimization methods, the optional values are:
- "Standard": standardized compression method;
- "Standard.keeplines": Keep line break;
- "Standard.keepcomments": Keep annotations;
- "Standard.keepComments.keepLines": Keep line break;
- "None": no compression;
Mainconfigfile
If you do not want to repeat the definition, you can use this parameter to configure the Requirejs configuration file path.
removecombined
Delete the merged file before compressing it, the default value is False.
Fileexclusionregexp
An expression that matches the regular match of the file to be excluded.
Modules
Defines an array of modules to be optimized. Each item is a module-optimized configuration, and several commonly used parameters are as follows:
Name: module name;
Create: If it does not exist, whether it is created. Default false;
Include: additional modules introduced, combined with the module defined by name, are compressed together;
Exclude: The module to exclude. Some modules have public dependency modules, each of which is compressed when combined, such as some base libraries. Using exclude, these modules can be compressed in a module that was loaded earlier, and other modules do not have to be introduced repeatedly.
The code directory is as follows
Main-build.js,production are generated by running node R.js-o build.js and need to switch to directory Test/develop below, that is, r.js and build.js directories to execute commands
<! DOCTYPE html>
The purpose of the Data-main property is to specify the main module of the Web program. In the example above, is the JS directory below the main.js, this file will be the first to be loaded require.js. Since the require.js default file suffix is JS, main.js can be shortened to main.
Build.js is as follows: Out is compressed into a. js file, dir is the local code, re-copy the code, as the line code, out and Dir can not appear simultaneously, the use will be reported conflict.
({ baseUrl: '. ', name: ' Main ', paths:{jquery: ' Jquery/jquery-1.11.0.min '}, out : ' Main-build.js ' /*dir: '. /production ' */})
Main.js configuration: Convenient require loading module
In theory, require.js-loaded modules must be modules defined in accordance with the AMD specification, with the Define () function. But in fact, even though some popular libraries (such as jquery) are already in compliance with the AMD specification, more libraries don't fit. So, is require.js able to load non-canonical modules?
The answer is yes.
Such modules are used to define some of their characteristics before they are loaded with require (), using the Require.config () method.
For example, both underscore and backbone are not written in the AMD specification. If you want to load them, you must first define their characteristics.
Require.config ({ paths:{ jquery: ' Jquery/jquery-1.11.0.min ' },
Shim: {
}
}) require ([' One ', ' sub/three ', ' jquery '],function (one,three) { alert (one+three);});
Requirejs and r.js compression tools