剛剛接手的新項目中應用了require.js，自己就花了點時間了解了一下，這里給大家推薦一個教學視頻 《阿當大話西游之Web組件》 ，視頻我是看了前邊幾節介紹又結合了新的項目，所學的知識就已經夠用了。
require.js 具體是什么？
RequireJS是一個工具庫，主要用於客戶端的模塊管理。它可以讓客戶端的代碼分成一個個模塊，實現異步或動態加載，從而提高代碼的性能和可維護性。它的模塊管理遵守AMD規范，模塊與模塊之間可以互相依賴，當然可能會有人會想，模塊之間的依賴，要是沒法正確地去按照特定順序加載，會出現錯誤，AMD規范可以處理這種問題，AMD就是這樣一種對模塊的定義，使模塊和它的依賴可以被異步的加載，但又按照正確的順序。
AMD是"Asynchronous Module Definition"的縮寫，意思就是"異步模塊定義"。它采用異步方式加載模塊，模塊的加載不影響它后面語句的運行。所有依賴這個模塊的語句，都定義在一個回調函數中，等到加載完成之后，這個回調函數才會運行。
如何使用 require.js？
下載require.js，引入網站的首頁，
<script data-main="js/framework/main.js" src="./lib/requirejs/require.js"></script>
這里首先會執行src中的require.js 的加載，隨后require.js會查找data-main所指的文件路徑，找到入口的js文件，注意這里可以去掉.js 的后綴名。
RequireJS有兩種最主要的方法，define()是用來定義一個模塊的，而require()方法是 用來加載模塊的。
define 方法
使用define方法，可以將一個js文件寫在此方法中，define(function(){ /*代碼內容*/ });作為一個獨立的模塊。如下，新建一個模塊名為mod1的js文件（mod1.js）：
define(function(){
return {
a:3
}
})
這是一個很簡單的模塊，mod1通過 return 一個對象，向外暴露一個變量 a=3 ；如果我們在創建一個mod2的模塊（mod2.js），要依賴mod1中的變量啊，則可以這么來：
define(['mod1'],function(m1){
var a,
b=2,
c=3;
a=c*m1.a;
return {
a:a,
b:b
}
})
分析上面的代碼，我們將mod1模塊引入到mod2模塊中，而function的參數 m1 就是mod1模塊的返回值，也是mod1模塊。m1.a就是mod1的return 對象a的值，為3，這樣mod1和mod2的變量雖然存在a變量名一樣的問題，但是互不影響，不沖突，這也是模塊化的一個好處，不會擔心變量沖突問題。
require方法
接下來，我們便可以通過require方法來使用前面我們定義好的模塊，，見其寫在main.js中
require(['mod2'],function(m2){
alert(m2.a)
});
使用該方法加載mod2個模塊，而mod2會去依賴mod1模塊，所以也會加載mod1這個模塊。
由於模塊返回的都是對象，那我們也可以new一個對象去調用加載模塊中的方法和屬性，見下：
//模塊名為：treeview
define(function(){
function treeview(){
this.name="treeview";
};
return { treeview:treeview };
})
require(['treeview'],function(b){
var tree = new b.treeview();
alert(tree.name);
});
如果模塊中需要引入第三方的js文件，例如jquery，則應該：
//treeview.js
define(['jquery'],function($){
function treeview(){
this.name="treeview";
};
return { treeview:treeview };
})
//main.js
//此時如果main.js這個應用層也需要用到jquery，雖然mian.js中依賴模塊treeview中已經引入了jquery文件，但是應用層main.js中依然還需要引入一次，
require(['treeview','jquery'],function(b,$){
$('#div').click(fucntion(){..........})
var tree = new b.treeview();
alert(tree.name);
});
模塊路徑 paths
在main.js,我們需要去配置一下模塊的路徑，這里隨便配置一下幾個模塊的路徑，如下：
require.config({
paths: {
"tabview": "js/tabview",
"animate": "js/animate",
"treeview": "js/treeview"
}
});
//另一種則是直接改變基目錄（baseUrl）。后綴.js可以省略
require.config({
baseUrl: "js/lib",
paths: {
"jquery": "jquery.min",
"underscore": "underscore.min",
"backbone": "backbone.min"
}
});