一：前端開發中常遇到的問題
如果我們的網站簡單的時候，結構上也許不會有什么問題，但是如果我們的網站越來復雜的時候（比如功能越來越多的時候，加入項目的人越來越多的時候），我們書寫的代碼就會遇到下面的兩個問題：
1. 惱人的命名沖突
比如我們多人開發一個項目，事先由我自己寫好了一個共公的組件庫common.js供大家調用，里面的包括
function tab(){
實現代碼：
};
function drag(){
實現代碼：
};
function dialog(){
實現代碼：
};.........
同事用的時候直接在頁面里引入common.js，然后調用下面的方法即可，如果后面又有一些新的同事加進來，他們在做其它的功能開發的時候，很有可能在頁面也會出現我組件庫里的方法，這樣這兩個組件之間就出現了沖突，是很影響功能效果的。
這個時候我們通常的做法是用命名空間來解決沖突的問題：比如原來的common.js變成
org.tab=function(){
實現代碼：
};
org.drag=function(){
實現代碼：
};
org.dialog=function(){
實現代碼：
}
這樣做在一定的程度上是解決了命名沖突的問題，但是由於前面的名字有可能比較長，調用的時候並不是特別的方便，而且這種做法只是降低了命名沖突的問題，並不能完全解決這個問題。看似簡單的沖突問題，但是如何才能優雅的解決，解決方案先不講，先看下面一個問題。
2. 繁瑣的文件依賴
繼續上面的例子，我接着ul層通用組件，這樣其他的同事就不用再重復的寫了。
其中有一個被大家非常喜歡的組件是tab.js,使用方法很簡單。例如下面的調用
<script src="common.js"></script>
<script src="tab.js"></script>
但是即便它非常的好用，還是會有同事跑過來說這個組件在調用的過程中會出現問題，經過一番的排查發現，原來在調用tab.js之前沒有引用common.js，導致tab.js無法正常工作。
所以從以上的問題中可以看出，沖突與依賴是前端開發中經常出現的問題，下面我們來看如何用模塊化開發來解決，我們使用Seajs作為模塊開發的框架。
二：Sea.js是什么？
sea.js是一個加載器，是淘寶前端攻城師玉伯所著，他是根據commonjs規范的一種表現。何為commonJS？commonJs可以理解成一個組織，他們中的所有人都致力於提高javascript程序的可移植性以及可交互性。這種可移植性以及可交互性不僅僅局限於瀏覽器端，而且也包括了服務器端的javascript.
那seaJS到底是什么呢？seaJS就是根據commonJS組織規范寫的一個加載器。其內部可用的API並不多主要有以下幾個：alias，config，use，define。主要就這四個API。seaJS主要就是根據這四個API對其環境中的javascript進行管理的。
sea.js主要用在
大型項目或是
多人合作的時候，如果小型的企業網站完全沒有必要用到它。另外，同
sea.js很相似的還有一個模塊開發的加載器，它叫require.js。它們之間有什么不同呢？
require.js是進口的，遵循AMD(
Asynchronous module define)規范，下載官網：
http://www.requirejs.org/
三：為什么我們要使用Sea.js？
seajs追求簡單、自然的代碼書寫和組織方式，具有以下的核心特征：
1.簡單友好的模塊定義規范：sea.js遵行CMD規范，可以像Node.js一樣書寫模塊代碼；
2.自然直觀的代碼組織方式：依賴的自動加載、配置簡潔清晰，可以讓我們更多的享受編碼的樂趣；
sea.js提供了常用插件，非常有助於開發調試和性能優化，並具有豐富的可可擴展接口；
四：Sea.js的兼容性
sea.js有着完備的測試用例，兼容所有的主流瀏覽器
chrome 3+ √
FireFox 2+ √
Safari 3.2+ √
opera 10+ √
IE5.5+ √
sea.js還可以運行在Mobiel端，包括Hybrid上。理論上sea.js可以運行在任何的瀏覽器引擎上。
五：使用Sea.js
上面講了一些基礎知識，下面來講一下 sea.js該怎么用：
主要可以分四步：
1）
引入sea.js庫：在文件頭開始的時候引入
<script src="sea.js"></script>，路徑要自己根據實際情況改變。
2 )
如何變成模塊：
單寫一個js文件，用define定義模塊，然后加入普通的函數形式。比如我們定義了普通函show(),
普通函數：function show(){
alert(1111);
}
sea.js模塊：define(function(require,exports,module){
function show(){
alert(1111);
}
});
注意：define(),這種形式也相當於JS里面的函數形式，所以里面可以套用函數，里面的第一個函數有三個參數，分別是：request,exports,module，這里有固定的三個參數，不允許隨意修改字母以及變換位置，你可以三個參數都寫或是三個都不寫，要不就是只寫第一個，或是只寫前兩個，這就是sea.js里面的死規定。
3 )
如何引入模塊：
exports：
seajs.use("相對地址的模塊名",function(參數){ });
sea.js中三個參數分別是什么意思呢？
require：引入，模塊之間依賴的接口
exports：導出，對外提供接口
module：批量導出
4）如何依賴模塊：
普通模塊： require（"相對地址的模塊名"）
seajs模塊：require（"相對地址的模塊名"）. seajs模塊名