原文写的很详细，推荐：https://www.jianshu.com/p/b8a6824c8e07
http://www.ruanyifeng.com/blog/2012/11/require_js.html
<script src="1.js"></script>
<script src="2.js"></script>
<script src="3.js"></script>
<script src="4.js"></script>（2）管理模块之间的依赖性，便于代码的编写和维护。
使用：如果你担心在头部引用这个require.js会使网页失去响应，你可以将它放底部，或者写成下面这样：
<script src="js/require.js" defer async="true" ></script>优点：
1.使用RequireJS，会在相关的js加载后执行回调函数，这个过程是异步的，所以它不会阻塞页面。
2.更加方便的模块依赖管理。相信你曾经一定遇到过因为script标签顺序问题而导致依赖关系发生错误，这个函数未定义，那个变量undefine之类的。通过RequireJS的机制，你能确保在所有的依赖模块都加载以后再执行相关的文件，所以可以起到依赖管理的作用。
3.更加高效的版本管理。想一想，如果你还是用的script脚本引入的方式来引入一个jQuery2.x的文件，然后你有100个页面都是这么引用的，那当你想换成jQuery3.x，那你就不得不去改这100个页面。但是如果你的requireJS有在config中做jQuery的path映射，那你只需要改一处地方即可。
<head>
<meta charset="UTF-8">
<title>require</title>
<script data-main="js/main" src="https://cdn.bootcss.com/require.js/2.3.5/require.js" defer async="true"></script>
</head>require.config({
paths : {
'jq' : ['https://cdn.bootcss.com/jquery/3.3.1/jquery','js/jquery']
},
baseUrl:'test/jss'
})
require(['jq','../../a'],function(){
console.log('全部加载完成');
$('span').css('color','red')
})requireJS在不同情况下的相对路径。
以下是相对路径的规则:
1.如果<script>标签引入require.js时没有指定data-main属性，则以引入该js的html文件所在的路径为根路径。
2.如果有指定data-main属性，也就是有指定入口文件，则以入口文件所在的路径为根路径。在本例子中也就是main.js所在的script文件夹就是根路径，这也是为什么配置jQuery的时候需要返回上层目录再进入lib目录才能找到jQuery文件。
3.如果再require.config()中有配置baseUrl，则以baseUrl的路径为根路径。
以上三条优先级逐级提升，如果有重叠，后面的根路径覆盖前面的根路径。
define
定义模块， define ( function (name, deps, callback){ }）,一个参数是定义模块名，第二个参数是传入定义模块所需要的依赖，第三个函数则是定义模块的主函数，主函数和require的回调函数一样，同样是在依赖加载完以后再调用执行。
// js/script/desc.js,没有依赖，第二个参数可以省略
define(function(){
return{
decs : 'this js will be request only if it is needed',
};
})
// js/script/alertdesc.js，有依赖，第二个参数为依赖的模块
define(['script/desc'],function(desc){
return function (){
alert(JSON.stringify(desc));
};
})
为什么省略第一个参数name，因为如果哪一天我将这个文件转移到其他目录下，那我就得在这这里再修改一次模块名。官方其实也不推荐，用官方的说法是:让优化工具去自动生成这些模块名吧！
异步加载依赖模块，浏览器不会失去响应；它指定的回调函数，只有前面的模块都加载成功后，才会运行，解决了依赖性的问题。
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
