前端模块规范

目前，前端js模块大体经历了以下几个步骤：

1. 命名空间
2. COMMONJS
3. AMD/CMD/UMD
4. ES6 module

1.命名空间

缺点：

• 不能有效的避免命名空间的覆盖问题
• 使用时必须输入完整，正确的路径。非常的不方便

2.commonJS

主要特点是：

• 一个文件为一个模块
• 通过module.exports暴露模块接口
• 通过require引入模块

• 同步执行

  示例代码：
  

3.AMD(Async Module Definition)

主要特点：

• 使用define定义模块
• 使用require加载模块
• 依赖前置，提前执行

代表作：RequireJS

示例代码：

模块名可以省略：

4.CMD(Common Module Definition)

主要规则：

• 一个文件为一个模块
• 使用define定义模块
• 使用require加载模块

• 尽可能懒执行

  代表作：SeaJS
  

5.UMD(Universal Module Definiton) 通用解决方案

主要原理：

• 判断是否支持AMD
• 判断是否支持CommonJS
• 如果都没有 使用全局变量

示例代码：

6.ES6 Module

主要特点：

• 一个文件为一个模块
• 使用export输出模块

• 使用import引入模块

  示例代码：