一、参考资料
1、官方文档：https://requirejs.org/（英文） http://www.requirejs.org.cn/（中文）
2、中文教程：
http://www.runoob.com/w3cnote/requirejs-tutorial-1.html 基础教程
http://www.runoob.com/w3cnote/requirejs-tutorial-2.html 基础教程
https://www.cnblogs.com/lzj0616/p/6208211.html 杂乱但提供很多案例
https://blog.csdn.net/bluesky1215/article/details/71079667 涉及“有主模块、无主模块”
http://www.php.cn/js-tutorial-392533.html 通俗易懂的入门文档
3、知识点：匿名函数，function(e,t)，具名模块，包装模块，有主模块
二、AMD介绍
1、传统JavaScript代码的问题：前端开发在近一两年发展的非常快，JavaScript作为主流的开发语言得到了前所未有的热捧。大量的前端框架出现了，这些框架都在尝试着解决一 些前端开发中的共性问题，但是实现又不尽相同。在这个背景下，CommonJS社区诞生了，为了让前端框架发展的更加成熟，CommonJS鼓励开发人员 一起在社区里为一些完成特定功能的框架制定规范。AMD（Asynchronous Module Definition）就是其中的一个规范。
2、让我们来看看一般情况下JavaScript代码是如何开发的：通过<script>标签来载入JavaScript文件，用全局变量 来区分不同的功能代码，全局变量之间的依赖关系需要显式的通过指定其加载顺序来解决，发布应用时要通过工具来压缩所有的JavaScript代码到一个文 件。当Web项目变得非常庞大，前端模块非常多的时候，手动管理这些全局变量间的依赖关系就变得很困难，这种做法显得非常的低效。
3、从名称上看便知它是适合script tag的。也可以说AMD是专门为浏览器中JavaScript环境设计的规范。它吸取了CommonJS的一些优点，但又不照搬它的格式。开始AMD作为CommonJS的transport format 存在，因无法与CommonJS开发者达成一致而独立出来。它有自己的wiki 和讨论组 。
4、AMD提出了一种基于模块的异步加载JavaScript代码的机制，它推荐开发人员将JavaScript代码封装进一个个模块，对全局对象的依 赖变成了对其他模块的依赖，无须再声明一大堆的全局变量。通过延迟和按需加载来解决各个模块的依赖关系。模块化的JavaScript代码好处很明显，各 个功能组件的松耦合性可以极大的提升代码的复用性、可维护性。这种非阻塞式的并发式快速加载JavaScript代码，使Web页面上其他不依赖 JavaScript代码的UI元素，如图片、CSS以及其他DOM节点得以先加载完毕，Web页面加载速度更快，用户也得到更好的体验。
5、目前，实现AMD的库有RequireJS 、curl 、Dojo 、bdLoad、JSLocalnet 、Nodules 等。也有很多库支持AMD规范，即将自己作为一个模块存在，如MooTools 、jQuery 、qwery 、bonzo 甚至还有 firebug 。
6、AMD设计出一个简洁的写模块API：define(id?, dependencies?, factory);
其中：
id: 模块标识，可以省略。
dependencies: 所依赖的模块，可以省略。
factory: 模块的实现，或者一个JavaScript对象。
以下是使用AMD模式开发的简单三层结构（基础库/UI层/应用层）：
A，定义无依赖的模块（base.js）
define(function() {
return {
mix: function(source, target) {
}
};
});B,定义有依赖的模块（ui.js，page.js）
define(['base'], function(base) {
return {
show: function() {
// todo with module base
}
}
});
define(['data', 'ui'], function(data, ui) {
// init here
});C,定义数据对象模块（data.js）
define({
users: [],
members: []
});D,具名模块
define('index', ['data','base'], function(data, base) {
// todo
});E,包装模块
define(function(require, exports, module) {
var base = require('base');
exports.show = function() {
// todo with module base
}
});三、requirejs的作用、API
1、使用了块作用域来申明function防止污染全局变量，声明不同js文件之间的依赖，可以按需、并行、延时载入js库，可以让我们的代码以模块化的方式组织
2、通常使用requirejs的话，我们只需要导入requirejs即可，不需要显式导入其它的js库，因为这个工作会交给requirejs来做。data-main 是告诉requirejs：你下载完以后，马上去载入真正的入口文件。它一般用来对requirejs进行配置，并且载入真正的程序模块。<script src="/path/to/require.js" data-main="/path/to/app/config.js"></script>
3、requirejs下。其主要API主要是下面三个函数、三个配置项:
A、define：全局函数, 用于创建一个新的模块,此方法可接受3个参数: define(name, deps, callback):
name: 可选参数, 模块名称
deps: 可选参数, 依赖模块数组
call: 必选, 回调函数, 若存在依赖的模块, 则被依赖的模块可以参数(我们称其为模块对象)的形式传入此回调函数, 并且参数的顺序与模块的依赖顺序一致.
B、require/requirejs：全局函数，该函数用于读取依赖。此方法可接受两个参数, require(deps, callback):
参数一为：数组, 表示所依赖的模块.
参数二为：回调函数, 指定的模块加载后, 将调用此函数; 加载的模块会以参数的形式传入此回调函数, 并且参数的顺序与模块的依赖顺序一致.
C、config：该函数用于配置RequireJS.
require.config配置参数选项
baseUrl——用于加载模块的根路径。
paths——用于映射不存在根路径下面的模块路径。
shims——配置在脚本/模块外面并没有使用RequireJS的函数依赖并且初始化函数。假设underscore并没有使用 RequireJS定义，但是你还是想通过RequireJS来使用它，那么你就需要在配置中把它定义为一个shim。
deps——加载依赖关系数组
waitSeconds——加载超时：每个context都配置了一个加载超时的时间，某个模块如果没有初始化，加载的时间又超过了这个时间，就会被认为加载失败。加载超时是针对整个context下的所有模块而言的，而不是单指某个模块.
context——空间名称 ：
4、requirejs一共提供了两个全局变量（前面说的是全局函数，网上抄的，是不是有矛盾）：
requirejs/require: 用来配置requirejs及载入入口模块。如果其中一个命名被其它库使用了，我们可以用另一个
define: 定义一个模块
四、requirejs的使用
main.js, 程序入口点, 主要有两个功能, 一是配置所需模板及模板间的依赖关系, 二是加载程序主模块.如果baseUrl不配置的话, 默认为main.js所在路径, 即其他模块的文件默认与main.js在同一个目录(或其子目录)
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script data-main="js/main.js" src="js/lib/require/require.js"></script>
</head>
<body>
<div>Hello World</div>
</body>
</html>main.js
require.config({
baseUrl: "js/",
paths: {
"jquery": ["lib/jquery/jQuery.v1.11.1.min"]
}
});
require(["jquery"], function(jq){
alert(jq().jquery);
});五、相关示例代码：
1、使用define函数定义一个无其它依赖的模块, 并调用其功能。
2、通过自定义属性进一步重构代码
3、使用define函数定义一个依赖其它模块的模块
4、引入非AMD规范的模块
5、暴露多个全局变量的非AMD模块
相关原理示例代码下载：https://download.csdn.net/download/lyb8010/10825765