1. 程式人生 > >(轉)RequireJS shim 用法說明

(轉)RequireJS shim 用法說明

log 對象 title .config eps rod || def val

RequireJS中如果使用AMD規範,在使用的過程中沒有太多的問題,如果加載非AMD規範的JS文件,就需要使用Require中的shim.

技術分享圖片
require.config({
    paths:{
        jquery:"/js/jquery2.0",
        InStorage:"/js/in/InStorage",
        Product:"/js/product/Product",
        cate:"/js/product/Category",
    },
    shim:{
        cate:{
            deps:[],
            exports:"Category"
        }
    }
});
技術分享圖片

  cate:"/js/product/Category" 該文件是非AMD規範的JS,在使用的過程中遵循如下幾個步驟:

  (1) paths 中配置文件加載的路徑, JSON中的 Key值可以隨意,盡量有意義,JSON中的Value是文件的加載路徑,這個不必多說

  (2) shim 中定義一個JSON對象, Key 值(cate) 與paths中定義的名字一樣

  (3) shim中的JSON對象有兩個屬性: deps,exports ; deps 為數組,表示其依賴的庫, exports 表示輸出的對象名

技術分享圖片
var Category=(function(){

    var param={};

    param.Add=function(){
        console.log("新增分類");
    }

    return param;

})();


var Category=(function(param){

    param.Write=function(){
        console.log("輸出分類信息");
    }

    return param;

})(Category||{});
技術分享圖片

  requirejs可以實現js的延時加載, 在方法調用的時候加載JS,也就是在function 中require 某個模塊的信息

技術分享圖片
define(function(){

    var ProductManager={
        Create:function(){
            console.log("創建產品");

            require(["cate"],function(cate){
                cate.Write();
                cate.Add();
            });
        }
    }

    return ProductManager;

});
技術分享圖片

(轉)RequireJS shim 用法說明