requireJS
RequireJS是一个工具库，主要用于客户端的模块管理。它可以让客户端的代码分成一个个模块，实现异步或动态加载，从而提高代码的性能和可维护性。它的模块管理遵守AMD规范。
使用requireJS的好处
- 异步加载
- 按需加载
- 模块依赖管理
- 版本管理
... ...
requireJS的用法
一、加载require.js
首先是去官网下载require.js最新版本，在页面上引入
xxx.html
- async属性表明这个文件需要异步加载，避免网页失去响应。IE不支持这个属性，只支持defer，所以把defer也写上。
- data-main属性指定的js文件会在require.js加载成功后第一个加载，是网页的入口代码。它一般用来对requirejs进行配置，并且载入真正的程序模块。
- require.js默认的文件后缀名是js，所以可以把main.js简写成main。
二、全局配置
main.js
require.config({
paths : {
"jquery" : ["https://cdn.bootcss.com/jquery/1.12.4/jquery.min", "js/jquery"], // 如果第一个cdn文件加载失败，就会加载第二个本地文件
"a" : "js/a",
"b" : "js/b"
},
shim : {
"bootstrap": ["jquery"],
"bootstrapTable": {
deps: ["bootstrap"], // deps数组，表明该模块的依赖性。
exports: "bootstrapTable" // exports值（输出的变量名），表明这个模块外部调用时的名称；
}
}
})
require.config 常用配置参数选项:
- baseUrl: 用于加载模块的根路径。(require会默认的将data-main指定的js为根路径)
- paths: 声明模块名称和文件路径
- shim: require.js加载的模块，必须是按照AMD规范、用define()函数定义的模块。但是有时候需要加载非AMD规范的js，shim参数能够帮助我们以AMD模块的方式，使用那些不符合AMD规范的模块。
三、定义模块
define方法用于定义模块，requireJS要求每个模块放在一个单独的文件里。
独立模块
如果被定义的模块是一个独立模块，不需要依赖任何其他模块，可以直接用define方法生成。
//定义对象
define({
num: 0,
method: function() {}
});
// 定义方法
define(function () {
return {
method1: function() {},
method2: function() {},
};
});
非独立模块
如果被定义的模块需要依赖其他模块，则define方法必须采用下面的格式。
define(['a'], function(a){
function foo(){
a.fn();
}
return {
foo : foo
};
});
define()函数的第一个参数，必须是一个数组，指明该模块的依赖性。当require()函数加载上面这个模块的时候，就会先加载a.js文件。
命名模块
前面两个都是匿名模块，可以在 requirejs.config 里，使用任意一个模块名来引用它。某些库（例如jquery）已经声明了一个确定的模块名:
define('jquery', [], function() { ... });
所以在 requirejs.config 里配置模块名时，只能用申明好的模块名。
自定义命名模块
define('myMod',['jquery', 'bootstrap'], function($, undefined){
var Controller = {
method1: function() {},
method2: function() {},
method3: function() {}
}
return Controller;
});
四、加载模块
require方法用于调用模块。
require( ['myMod'], function( mod ) {
mod.method1();
});