模块化相关知识

CMJ：node环境中的模块化规范。
AMD：在浏览器端运行的JS模块化规范。
UMD：CMJ和AMD的集成，会依次判断exports和define是否存在来决定使用CMJ规范还是AMD规范。
ESM：js语言层面的模块化规范。

既然有了ESM,为何还需要打包工具？

ESM有自己的关键字(import、export)和语法(空格等)，每个JS的运行环境都有一个解析器，然而不是所有的解析器都能识别esm的语法！
比如：

• 浏览器的版本比较低，就不能识别ES6中的新增的ESM规范。WEB端受制于用户，不能让所有的用户都升级浏览器！因为社区出现了很多工具，用来转换es代码，如babel。但是babel对于esm的支持明显不好，因为它会将esm规范编译位cmj规范，同样不能在浏览器端运行。为了解决这个问题，需要 打包，打包工具的作用就是抹平模块化内部实现的细节，将其变成可以直接运行的web或者node中的内容。或者可以指定babel将模块化转化为umd的规范！umd?
• node在12版本之后才可以使用ESM。
  
  ESM.png

CMJ和AMD的差异？

不同于commonjs的同步加载，为了使页面在解析脚本文件的过程中不阻塞页面，AMD使用异步加载。
使用AMD规范进行页面需求开发，需要添加一个符合AMD规范的加载器脚本，有名的库有：require.js。

打包脚本实践

待上传代码