模块 库 简介
CommonJS 同步加载 CommonJS规范主要用于服务端编程，加载模块是同步的，这并不适合在浏览器环境，因为同步意味着阻塞加载，浏览器资源是异步加载的，因此有了AMD CMD解决方案。
AMD 异步加载（对象） requireJS AMD规范在浏览器环境中异步加载模块，而且可以并行加载多个模块。不过，AMD规范开发成本高，代码的阅读和书写比较困难，模块定义方式的语义不顺畅。
CMD 按需加载 sea.js CMD规范与AMD规范很相似，都用于浏览器编程，依赖就近，延迟执行，可以很容易在Node.js中运行。不过，依赖SPM 打包，模块的加载逻辑偏重
UMD 兼容AMD, CommonJS模块化语法
ES6 Module 加载引用 ES6 在语言标准的层面上，实现了模块功能，而且实现得相当简单，完全可以取代 CommonJS 和 AMD 规范，成为浏览器和服务器通用的模块解决方案。

差异

⭐️ ES6 模块与 CommonJS 模块的差异

一、ES6、CommonJS的差异

  • CommonJS模块输出的是一个值的拷贝，ES6模块输出的是值的引用。
  • CommonJS模块是运行时加载，ES6模块是编译时输出接口。

二、 CommonJS 模块输出的是一个值的拷贝，ES6 模块输出的是值的引用。

| 【示例】```javascript // CommonJS

// lib.js var counter = 3; function incCounter() { counter++; } module.exports = { counter: counter, incCounter: incCounter, };

// main.js var counter = require(‘./lib’).counter; var incCounter = require(‘./lib’).incCounter; console.log(counter); // 3 incCounter(); console.log(counter); // 3

  1. ```javascript
  2. // es6
  4. // lib.js
  5. export let counter = 3;
  6. export function incCounter() {
  7.   counter++;
  8. }
  9. // main.js
  10. import { counter, incCounter } from './lib';
  11. console.log(counter); // 3
  12. incCounter();
  13. console.log(counter); // 4

| | —- |

三、 CommonJS 模块是运行时加载，ES6 模块是编译时输出接口。
1、因为 CommonJS 加载的是一个对象（即module.exports属性），该对象只有在脚本运行完才会生成。而 ES6 模块不是对象，它的对外接口只是一种静态定义，在代码静态解析阶段就会生成。
2、ES6 模块的运行机制与 CommonJS 不一样。ES6 模块是动态引用，并且不会缓存值，模块里面的变量绑定其所在的模块。CommonJS模块可以多次加载，但是只会在第一次加载时运行一次，然后运行结果就被缓存了，以后再加载，就直接读取缓存结果。要想让模块再次运行，必须清除缓存。

AMD、CommonJS不同点

一、AMD、CommonJs
1、CommonJS规范加载模块是同步的，也就是说，只有加载完成，才能执行后面的操作。
AMD规范则是非同步加载模块，允许指定回调函数。
2、由于Node.js主要用于服务器编程，模块文件一般都已经存在于本地硬盘，所以加载起来比较快，不用考虑非同步加载的方式，所以CommonJS规范比较适用。
但是，如果是浏览器环境，要从服务器端加载模块，这时就必须采用非同步模式，因此浏览器端一般采用AMD规范。
3、AMD规范比CommonJS规范在浏览器端实现要来着早。