可以使用RequireJS最佳化,將所有JS檔案壓縮成一個
一.準備工作
1.安裝nodejs
執行optimization 需要使用nodejs執行
下載與安裝
2.下載r.js檔案
這是用來執行工作的nodeJS Script檔案
下載
3.建立profile.js
檔案關聯設定檔
二.檔案架構
要執行最佳化工作是
nodejs以profile.js當作執行設定檔,來執行r.js,
請建立一個build的目錄來放置r.js與profile.js
build目錄不要放到backbone project js目錄下
檔案架構可以是
project/build/(放r.js與profile.js)
project/js/(所有專案內的js檔案)
三.profile.js的設定
1.baseUrl: 為profile.js所在目錄算起 要找到main.js的目錄參考
例如 baseUrl:../js/
2.out:要輸出結果的檔案名稱與路徑
例 out: "../js/main.min.js",
3.paths:將main.js下設定的paths copy過來再加上require的路徑參考
例
paths : { 
  _loader:'utils/loader', 
  _$ : 'libs/jquery/jquery',  
  ...
  requireLib:'libs/require/require-min'       
}
4.include 設定requirejs的參考例
include:'requireLib'
5.sample
({
    baseUrl: "../js/",
    name: "main",
    out: "../js/main.min.js",
    paths : {    
        _loader:'utils/loader',    
        _$:'libs/jquery/jquery',        
        _Underscore : 'libs/underscore/underscore',
        _Backbone : 'libs/backbone/backbone',
        ...
        requireLib:'libs/require/require-min'    
    },    
    include:'requireLib'
})  
四.執行
node r.js -o profile.js
五.網頁上使用
未作最佳化前使用
 <script data-main="js/main" src="js/libs/require/require.js"></script>  
最佳化後使用 <script src="js/main.min.js"></script>  
沒有留言:
張貼留言