CommonJS和AMD/CMD

2018/08/29 posted in  Web前端

CommonJS根据JS的表现制定规范:

{模块引用(require)} {模块定义(exports)} {模块标识(module)}

NodeJS遵循了CommonJS规范,写法如下:

// foo.js

module.exports = function(x) {
    console.log(x);
};
// index.js

let foo = require('./foo')
foo(1);

CommonJS主要为了JS在后端制定的规范,但并不适用与前端,因为代码在是通过网络加载,所以AMD(异步模块定义)出现:

define(['dep1','dep2'],function(dep1,dep2){...});

RequireJS实现了AMD规范,写法如下:

// foo.js

define(function() {
    return function(x) {
        console.log(x);
    };
});
// index.js

define(['foo'], function(foo) {
    foo(2);
});

CMD (通用模块定义)写法更加直观:

// 所有模块都通过 define 来定义
define(function(require, exports, module) {

// 通过 require 引入依赖
var $ = require('jquery');
var Spinning = require('./spinning');

// 通过 exports 对外提供接口
exports.doSomething = ...

// 或者通过 module.exports 提供整个接口
module.exports = ...
});

// foo.js

define(function(require, exports, module) {
  module.exports = function(x) {
      console.log(x);
  }
});
// index.js

define(function(require, exports, module) {
    var foo = require('foo');
    foo(3);
});