AMD/CMD/commonjs/ESM

js模块化发展史

1 命名空间:

    库名.类别名.方法名

AMD/CMD/commonjs/ESM_第1张图片

2 commonjs   :用于后端的node

通过 module.exports 暴露模块接口,通过 require 引入模块,特点:同步执行

AMD/CMD/commonjs/ESM_第2张图片

3 AMD/CMD/UMD  :用于前端

AMD(Async Module Definition)使用 define 定义模块,使用 require 加载模块,特点:依赖前置,提前执行

AMD/CMD/commonjs/ESM_第3张图片

CMD(Common Module Definition)使用define 来定义一个模块,使用require 来加载一个模块,特点:尽可能懒执行

AMD/CMD/commonjs/ESM_第4张图片

UMD(Universal Module Definition)通用解决方案,三个步奏:判断是否支持 AMD,判断是否支持 CommonJS,如果都没有 使用全局变量

AMD/CMD/commonjs/ESM_第5张图片

4 ES6 module (EcmaScript Module)export / import,import()

AMD/CMD/commonjs/ESM_第6张图片AMD/CMD/commonjs/ESM_第7张图片AMD/CMD/commonjs/ESM_第8张图片AMD/CMD/commonjs/ESM_第9张图片AMD/CMD/commonjs/ESM_第10张图片

你可能感兴趣的:(js)