Commonjs、AMD、CMD

CommonJS

該規範的核心思想是容許模塊經過 require 方法來同步加載所要依賴的其餘模塊，而後經過 exports 或 module.exports 來導出須要暴露的接口

require("module");
require("../file.js");
exports.doStuff = function() {};
module.exports = someValue;

優勢：

• 服務器端模塊便於重用
• NPM 中已經有將近20萬個可使用模塊包
• 簡單並容易使用

缺點：

• 同步的模塊加載方式不適合在瀏覽器環境中，同步意味着阻塞加載，瀏覽器資源是異步加載的
• 不能非阻塞的並行加載多個模塊

實現：

• 服務器端的 Node.js
• Browserify，瀏覽器端的 CommonJS 實現，可使用 NPM 的模塊，可是編譯打包後的文件體積可能很大

 

AMD

Asynchronous Module Definition 規範其實只有一個主要接口 define(id?, dependencies?, factory)，它要在聲明模塊的時候指定全部的依賴 dependencies，而且還要當作形參傳到 factory 中，對於依賴的模塊提早執行，依賴前置。

define("module", ["dep1", "dep2"], function(d1, d2) {
  return someExportedValue;
});
require(["module", "../file"], function(module, file) { /* ... */ });

優勢：

• 適合在瀏覽器環境中異步加載模塊
• 能夠並行加載多個模塊

缺點：

• 提升了開發成本，代碼的閱讀和書寫比較困難，模塊定義方式的語義不暢
• 不符合通用的模塊化思惟方式，是一種妥協的實現

實現：

• RequireJS
• curl

 

CMD

Common Module Definition 規範和 AMD 很類似，儘可能保持簡單，並與 CommonJS 和 Node.js 的 Modules 規範保持了很大的兼容性。

define(function(require, exports, module) {
  var $ = require('jquery');
  var Spinning = require('./spinning');
  exports.doSomething = ...
  module.exports = ...
})

優勢：

• 依賴就近，延遲執行
• 能夠很容易在 Node.js 中運行

缺點：

• 依賴 SPM 打包，模塊的加載邏輯偏重

實現：

• Sea.js
• coolie