ES6/Commonjs/AMD的模組引用方式區別
阿新 • • 發佈:2019-01-08
ES6
//匯出:
export { }
export default = { }
//匯入:
import { } from ..
Commonjs:(使用於伺服器端,同步載入)
模組定義與載入:
// foo.js
module.exports = function(x) {
console.log(x);
};
// main.js
var foo = require("./foo");
foo("Hi");
AMD:(適用於瀏覽器端,非同步載入)(require.js)
//模組的載入:
// main.js
require(['moduleA', 'moduleB' , 'moduleC'], function (moduleA, moduleB, moduleC){
// some code here
});
//模組載入時指定模組路徑
require.config({
baseUrl: "js/lib", //指定模組路徑的根路徑
paths: {
"jquery": "jquery.min", //模組名稱與模組路徑對應
"underscore": "underscore.min",
"backbone": "backbone.min"
}
});
//模組的定義
//此模組的定義又依賴其他模組時可在define中加第一個引數,如沒有可不加
define(['myLib'], function(myLib){
function foo(){
myLib.doSomething();
}
return {
foo : foo
};
});