对于像我这种requireJS初学者而言，requireJS最难理解的部分应该是它的路径问题。晚上随便折腾了一下，算是稍微理清了这个目录问题吧。
requireJS学习网址：requireJS中文网 requireJS英文网
随着前端代码量的日益庞大和复杂的结构，以及越来越多框架的出现，如何有效的管理你的代码，已经成为一个团队亟待解决的问题。而RequireJS的目标是鼓励代码的模块化，它使用了不同于传统script标签的脚本加载步骤。可以用它来加速、优化代码，但其主要目的还是为了代码的模块化。RequireJS以一个相对于baseUrl的地址来加载所有的代码。下图是随便写的一个小的DEMO文件目录：
首先在index.html页面中引入requireJS文件
<script src="js/lib/require.js" data-main="js/entry"></script>或者
<script src="js/lib/require.js"></script>引入requireJS文件，可以需要接下来文件的主入口属性data-main，也可以不需要。
如果没有data-main属性，则baseUrl默认为引入requireJS文件的HTML所处的位置，上述代码中为“wechart/”。
如果有data-main属性，则baseUrl默认为data-main属性值中的文件目录，上述中即为“js”。
可以在require.config({})中明确设置。
DEMO中把相关的配置写进了主入口文件即entry.js中
require.config({
baseUrl: "js/",
paths: {
jquery: "lib/jquery/jquery-1.7.1"
}
});baseUrl的目录不是以“/”或者相关协议（如http或https）开头，则默认为相对路径。例如我们把上面baseUrl改成“/js/”,则就变成相对于磁盘的根目录啦。
这里可以看到jquery和a两个文件没有正确加载。原因是目录相对于c盘了。其余模块正常加载原因继续向下看。
define([‘jquery‘], function($) {
return function() {
$("#test").html("<p>aaa</p>");
}
});模块a中的文件依赖jquery，需要先加载jquery之后才能执行模块里面的回调函数，而jquery的模块查找完整路径即为entry.js里面的baseUrl+paths配置目录(paths具体配置可参考官网相关介绍)，即为**”wechart/js/lib/jquery/jquery-1.7.1.js”。
DEMO中我的模块b依赖于模块a：
define([‘jquery‘,‘my/a‘], function($, a) {
a();
console.log("bbb");
});则模块b加载前加载模块的目录为baseUrl+依赖中定义的目录，上述加载模块a的目录为js/my/a.js。由于模块a的路径也需要根据baseUrl来查找，所以上面baseUrl更改成“/js/”时，模块a也加载出错。
require中相关模块路径查找为baseUrl+require依赖中所给目录
但是，
由于require内部模块加载机制为异步加载，所以相应的baseUrl需区分以下情况
由于上面叙述过，如果有data-main,且文件里有baseUrl配置，则baseUrl应为配置中的“js/”,但因为requireJS异步加载机制，主入口文件需要在HTML的所有script文件加载后才开始加载，即在require执行加载模块时，相应的主入口文件entry.js尚未被加载。则此时的baseUrl仍为主入口的文件目录。所以HTML中加载模块b时需要使用“../”进入“js/”目录。
DEMO中index.html代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div id="test">111</div>
<script src="js/lib/require.js" data-main="js/entry/entry"></script>
<script>
require([‘../my/b‘], function(b) {
console.log("b has been called");
});
</script>
</body>
</html>把相应的配置文件代码放在加载模块代码前，则此时的baseUrl即为配置中的目录。相应的HTML代码更改为
<script>
require.config({
baseUrl: "js/",
paths: {
jquery: "lib/jquery/jquery-1.7.1"
}
});
require([‘my/b‘], function(b) {
console.log("b has been called");
});
</script>对于无配置文件的情况不利于代码的后期维护，果断省略。。。
版权声明：本文为博主原创文章，未经博主允许不得转载。
原文地址：http://blog.csdn.net/xqg666666/article/details/46808209
