快速学会使用require.js
1.get start
先到官网下载requirejs到本地，官方同时提供Node版本r.js，我们只使用requirejs即可。
接下来在页面上写入
<scrpit src="/js/require.js"></scrpit>
即可。
那么业务js呢？我们注意到，官方文档提到了data-main这个属性
<script src="js/require.js" data-main="js/main"></script>
这个data-main所对应的js，是入口js，requirejs会首先加载这个js，然后才会根据依赖异步加载其他的依赖模块。
在main.js里，我们可以编写业务代码，在编写的时候，要注意处理好依赖。
例如，main.js依赖于工具类tools.js，在main.js中，就应该这么写
require(['js/tools'], function (Tools) { // Tools对应于数组中的tools，多个参数一一对应
// 编写业务逻辑
})
这就是一个简单的require的使用了。
2.处理依赖
在上一节，我们注意到main.js里面require引入了tools，如果我们依赖许多js，那岂不是每个都要写对应的路径和全名，岂不是很麻烦。
针对这个问题，requirejs提供了一个config函数，用来自定义加载行为。
require.config(
path:{
'zepto': 'js/zepto.min',
'tools': 'js/tools'
}
)
只需要在main.js最前方加入这个配置函数即可。我们就能简化部分代码。
但是我还是觉得不够好，这样的话，如果我有多个页面，我每次都要写好几次重复config函数，很多余，复制粘贴超过三次，我们就该考虑复用的问题。
当然，requirejs的作者也想到了这个问题。实际上，即使是在一个spa项目中，也不能真的只有一个html。所以，我们可以编写一个config.js来存放我们对require的配置。
// config.js
var require = {
baseUrl: './js',
waitSeconds: 0,
paths: {
'zepto': 'zepto.min',
'tools': 'tools'
},
shim: {
zepto: {exports: '$'},
common:{exports: 'common', deps: ['zepto']}
}
};
上面列出了一些配置项，可以在官网找到对应内容。简单列几个常见的配置项：
baseUrl: the root path to use for all module lookups.
即根目录，所有的模块都从baseUrl目录下去查找js。
paths: path mappings for module names not found directly under baseUrl.
无需多言，需要注意，path中配置的模块，都是基于baseUrl的。
shim: Configure the dependencies, exports, and custom initialization for older, traditional "browser globals" scripts that do not use define() to declare the dependencies and set a module value.
shim是我们在面对一些不支持amd写法的老模块时需要进行配置的地方。比如zepto。
waitSeconds: The number of seconds to wait before giving up on loading a script. Setting it to 0 disables the timeout. The default is 7 seconds.
waitSecond用来设置寻找js的时长，默认7s，正常情况下，我们会设置为0，因为一般来说，如果一切正常，不会出现找不到的情况。
callback: A function to execute after deps have been loaded. Useful when require is defined as a config object before require.js is loaded, and you want to specify a function to require after the configuration's deps array has been loaded.
callback函数会在全部依赖加载完毕后调用，可以用来做一些初始化的操作。
我在这里不能一一举例，详细查看官方配置项页面。
在cogfig.js编写完毕以后，就可以在页面中导入它了。
<script src="js/config.js"></script>
<script src="js/require.js" data-main="main"></script>
此处需要注意的是，一旦配置了configjs中baseUrl，那么data-main中的main.js也要根据baseUrl去找。
3.编写我们的依赖模块
在开发中，我们也需要编写自己的依赖模块，例如tools工具集，这节介绍如何编写符合AMD规范的模块。
下面是一个例子：
define(['zepto'], function($){
function sayHi(){
$('title').text = 'Hi';
}
return {
sayHi : sayHi
};
});
如果无依赖，则第一个参数不传或传空数组即可。
4.实际开发中遇到的问题
事实上，在实际开发中，我们会需要把所有的静态资源（img，js，css）放到cdn上。这时，在打包的时候，就需要修改baseUrl，如果配置了的话。
因为html页面放置在服务器上，可能地址为 https://www.xx.com/index.html 。在html中的js引入应该为
<script src="//static.xx.com/xxxx/js/config.js"></script>
此时config.js放置在cdn上，如果baseUrl依然为./js，很显然，就会链到当前页面所在目录下js文件夹，也就是 https://www.xx.com/js/ ,明显不对。
所以在打cdn包的时候，要注意修改baseUrl为cdn地址。
在cdn打包时，还有一个需要注意的地方，我们会加入md5来防止版本冲突。例如tools.js打包完成后，会变成tool.3jf321.js。这时，config.js中的path路径也需要做修改，链到加了md5的js上。
一般来说，我们都是用grunt和gulp等工具做打包。
加入md5的时候，一般会在rev目录下生成一个mainfest.json，存放了一一对应的对象，我们只需要将这个对象遍历修改即可。
我使用gulp来打包，基本写法如下，仅供参考：
var cdn_url = '//static.xxx.com/xxx/';
gulp.task('rev', function() {
return gulp.src(['rev/**/*.json', 'dist/*.html'])
.pipe(revCollector({
replaceReved: true,
dirReplacements: {
'css': function(manifest_value) {
return cdn_url + 'css/' + manifest_value;
},
'js': function(manifest_value) {
return cdn_url + 'js/' + manifest_value;
},
}
}))
.pipe(gulp.dest('cdn'));
});
以上就是在使用require.js的一些基本技巧，感谢阅读。