RequireJS is a JavaScript file and module loader. It is optimized for in-browser use, but it can be used in other JavaScript environments, like Rhino and Node. Using a modular script loader like RequireJS will improve the speed and quality of your code.
随着网站功能逐渐丰富，网页中的js也变得越来越复杂和臃肿，原有通过script标签来导入一个个的js文件这种方式已经不能满足现在互联网开发模式，我们需要团队协作、模块复用、单元测试等等一系列复杂的需求。
RequireJS是一个非常小巧的JavaScript模块载入框架，是AMD规范最好的实现者之一。RequireJS压缩后只有14K，轻量。它还同时可以和其他的框架协同工作。
RequireJS核心功能：
声明不同js文件之间的依赖
可以按需、并行、延时载入js库
可以让我们的代码以模块化的方式组织
初看起来并不复杂。
HOW TO
在HTML中，添加这样的 <script> 标签：
<!-- JavaScript -->
<script data-main="js/main" src="js/libs/require/require.js"></script>
属性 data-main 是告诉requirejs：你下载完require.js以后，马上去载入真正的入口文件main.js。它一般用来对requirejs进行配置，并且载入真正的程序模块。
main.js
在main.js 中通常做两件事：
配置requirejs 比如项目中用到哪些模块，文件路径是什么
载入程序主模块
/**
* 真正的入口文件main.js。它一般用来对requirejs进行配置，并且载入真正的程序模块。
*/
require.config({
paths: {
jquery: 'libs/jquery-2.1.4.min',
jqueryUi: 'libs/jquery-ui.min',
underscore: 'libs/underscore-min',
backbone: 'libs/backbone-min',
bootstarp: 'libs/bootstrap.min',
fancytree: 'libs/jquery.fancytree-all.min',
selectize: 'libs/selectize.min',
mCustomScrollbar: 'libs/jquery.mCustomScrollbar.concat.min',
text: 'libs/require/text',
typeahead: 'libs/typeahead.bundle.min',
bloodhound: 'libs/typeahead.bundle.min',
bootpag: 'libs/bootpag.min',
moment: 'libs/moment',
datatables: 'plugin/datatables/jquery.dataTables',
jsonview: 'plugin/jsonview/jquery.jsonview',
bootstrapDialog: 'plugin/bootstrap-dialog/bootstrap-dialog'
},
shim: {
'underscore': {
exports: '_'
},
'jqueryUi': {
deps: ['jquery']
},
'bootstarp': {
deps: ['jquery', 'jqueryUi']
},
'fancytree': {
deps: ['jquery', 'jqueryUi']
},
'common/base': {
deps: ['underscore']
},
'views/conversation-view/': {
deps: ['jquery']
},
'views/app-view/': {
deps: ['jquery']
},
'typeahead': {
deps: ['jquery', 'bloodhound']
},
'datatables': {
deps: ['jquery']
},
'jsonview': {
deps: ['jquery']
},
'bootstrapDialog': {
deps: ['jquery']
}
}
});
这里的 define 是requirejs提供的函数。requirejs一共提供了两个全局变量：
requirejs/require: 用来配置requirejs及载入入口模块。如果其中一个命名被其它库使用了，我们可以用另一个
define: 定义一个模块
使用 shim
shim是将依赖中的全局变量暴露给requirejs，当作这个模块本身的引用。
requirejs.config({
baseUrl: '/public/js',
paths: {
hello: 'hello'
},
shim: {
hello: { exports: 'hello' }
}
});
requirejs(['hello'], function(hello) {
hello();
});
上面代码 exports: 'hello' 中的 hello ，是我们在 hello.js 中定义的 hello 函数。当我们使用 function hello() {} 的方式定义一个函数的时候，它就是全局可用的。如果我们选择了把它 export 给requirejs，那当我们的代码依赖于 hello 模块的时候，就可以拿到这个 hello 函数的引用了。
