RequireJS模組化開發

本篇文章介紹的內容是RequireJS模組化開發，現在分享給大家，有需要的朋友可以參考一下

模組化開發有很多種方式，如AMD，CMD,

使用require進行模組化，只要導入一個js就可，

使用require.js的第一步，是先去官方網站下載最新版本。

下載後，假定把它放在js子目錄下面，就可以載入了。

　<script src="js/require.js"></script>

有人可能會想到，載入這個文件，也可能造成網頁失去回應。解決辦法有兩個，一個是把它放在網頁底部加載，另一個是寫成下面這樣：

　<script src="js/require.js" defer async="true" ></script>

async屬性表明這個文件需要異步加載，避免網頁失去響應。 IE不支援這個屬性，只支援defer，所以把defer也寫上。

載入require.js以後，下一步就要載入我們自己的程式碼了。假定我們自己的程式碼檔案是main.js，也放在js目錄下面。那麼，只需要寫成下面這樣就行了：

　<script src="js/require.js" data-main="js/main"></script>

data-main屬性的作用是，指定網頁程式的主模組。在上例中，就是js目錄下面的main.js，這個檔案會第一個被require.js載入。由於require.js預設的檔案後綴名是js，所以可以把main.js簡寫成main。

模組化：

define([“aa”],function(){//[“aa”]是你要依賴的js,多個的話，用逗號隔開，如果過沒有，可不寫。

##模組化開發有很多種方式，如AMD，CMD,

使用require進行模組化，只要導入一個js就可，

使用require.js的第一步，是先去官方網站下載最新版本。 ，也可能造成網頁失去回應。回應。 .js，也放在js目錄下面。下面的main.js，這個檔案會第一個被require.js載入。

##define([“aa”],function(){//[“aa”]是你要依賴的js,多個的話，用逗號隔開，如果過沒有，可不寫。

 function fn(){
        //你要写的js代码
    }    return {
        fn:fn;//必须要有返回，用来在main中调用
    }
})

main.js

require.config({
 paths:{//路径起的名字 "jquery":"jquery-1.8.3.min", "cookie":"jquery.cookie"

 }
})require(['jquery','cookie','details'], function ($,cookie,Backbone){
    //数组中的是模块，模块都是一部加载的，function为每个模块的回调函数 cookie.fn();
 });

如果陣列中有下載的插件，將插件模組化，給其加上define(function(){})

相關推薦：

JS模組化-RequireJS

requireJS實作一個簡單的模組載入器實例分享

RequireJs 原始碼剖析推出腳本載入的工作原理

以上是RequireJS模組化開發的詳細內容。更多資訊請關注PHP中文網其他相關文章！