>[success] # JS -- improt、require、amd三者经行模块化开发，三者的区别 ~~~ 1使用improt、require、amd三者经行模块化开发，三者的区别 ~~~ >[danger] ##### improt、require、amd三者 ~~~ 1.三者都是可以让js进行模块化的方案，import是es6 开始支持方式，require 是node支持的commonJs规范，Amd是支持客户端的一种方式 ~~~ * commonJs -- 支持服务端 ~~~ 1.CommonJS模块的设计考虑了服务器开发。当然，API是同步的，执行的顺序是 依次使用requrie 导入的顺序决定的 优点： 1.简单:开发人员无需查看文档就可以掌握概念。 2.集成了依赖关系管理:模块需要其他模块并按所需顺序加载。 3.require可以在任何地方调用:可以以编程方式加载模块。 4.支持循环依赖项。 缺点: 1.同步API使它不适合某些用途(客户端)。 2.每个模块一个文件。 3.浏览器需要加载程序库或传送。 4.静态代码分析器很难分析 ~~~ * amd -- 支持客户端 ~~~ 1.AMD是"Asynchronous Module Definition"的缩写，意思就是"异步模块定义"。它 采用异步方式加载模块，模块的加载不影响它后面语句的运行。所有依赖这个模 块的语句，都定义在一个回调函数中，等到加载完成之后，这个回调函数才会运 行。 优点: 1.异步加载(更好的启动时间)。 2.支持循环依赖项。 3.需求和导出的兼容性。 4.完全集成了依赖性管理。 5.如果需要，可以将模块分割成多个文件。 6.支持构造函数。 7.插件支持(自定义加载步骤)。 缺点: 1.语法稍微复杂一点。 2.除非进行了传输，否则需要加载程序库。 3.静态代码分析器很难分析。 ~~~ * es6 -- import ~~~ 1.es6 后来进行了重新规范，因此引申出import 这种模块化方式 优点 1.支持同步和异步加载。 2.语法简单。 3.支持静态分析工具。 4.集成在语言中(最终在任何地方都支持，不需要库)。 5.循环依赖的支持。 缺点 1.新版以后的浏览器支持 ~~~ * 总结 ~~~ 1.CommonJS 加载模块是同步的，所以只有加载完成才能执行后面的操作。像 Node.js主要用于服务器的编程，加载的模块文件一般都已经存在本地硬盘，所以 加载起来比较快，不用考虑异步加载的方式，所以CommonJS规范比较适用。但 如果是浏览器环境，要从服务器加载模块，这是就必须采用异步模式。所以就有 了 AMD 解决方案 2.import 诞生让整体的导入更加方便，但由于，没有一个主流JavaScript运行时在 其当前稳定的分支中支持ES2015模块。这意味着不支持Firefox、Chrome或 Node.js。幸运的是，许多变频器都支持模组和填充。目前，为Babel预置的 ES2015可以轻松处理模块。 3.构建模块和处理依赖关系非常麻烦。以库或ES2015模块形式出现的新解决方案 消除了大部分痛苦。如果您正在考虑启动一个新的模块或项目，那么ES2015是正 确的选择。它将永远被支持，目前的支持使用变频器和填充是优秀的。另一方 面，如果您更喜欢使用普通的ES5代码，那么通常在客户端的AMD和服务器端的 CommonJS/Node之间进行分割仍然是常见的选择 4.import在静态解析阶段执行，所以它是一个模块之中最早执行的 5.`require`是运行时加载模块 ~~~ [AMD , CMD, CommonJS，ES Module，UMD](https://juejin.cn/post/6844903663404580878) * 参考文章 1.<a href=“https://www.jianshu.com/p/ce92a09ad6eb”>关于node模块化对import 支持</a> 2.<a href="https://auth0.com/blog/javascript-module-systems-showdown/">关于三者对比的英文文档</a> 3.<a href="http://www.ruanyifeng.com/blog/2012/10/asynchronous_module_definition.html">阮一峰的关于amd 和commjs 区别</a> 4.<a href="https://zccst.iteye.com/blog/2215317">amd/cmd/commonjs三者区别</a>[TOC] md/cmd/commonjs三者区别</a> [参考文章](https://my.oschina.net/qcloudcommunity/blog/2992386)