模块化与组件化的区别
- 模块化解耦复杂度，即将功能分成小块
- 组件化我理解为可复用的功能，比如写一个轮播组件，基于Vue框架的UI组件库中的一个组件
- 以下主要讨论模块化的历史
最初
在一个index.html里的script块里我们直接写很多js代码
随后
用引入一个js文件替代这种方式。在js文件里的代码不断增多时，可以把一个js中不同功能的部分抽离出来，写成多个js文件。
-
MVC
一个js文件中的代码又可用MVC来设计，具有很好的可读性。
-
依赖顺序
<script src="a.js"></script>
<script src="b.js"></script>
这种方式下，依然需要用script方式引入多个js文件，严重依赖于引入顺序，若b模块依赖a模块，则顺序错误时便会出错。
import export的方式解决了这一问题，明确了每部分模块的依赖关系。
Node.js出世
适用于服务器端的规范——CommonJs
- 使用require来获取依赖模块
- 不能用于浏览器端
浏览器端的模块解决方案
-
AMD（Asynchronous Module Definition）规范
- 非原生
- RequireJs实现
-
CMD（Common Module Definition）规范
- 玉伯，自立门户
- 非原生
- SeaJs实现
-
AMD和CMD差异
- 主要在于何时加载和运行依赖项？
- AMD 声明依赖后即将依赖模块运行
- CMD在需要依赖时才会运行依赖模块。
统一规范
CommnJs，RequireJs，SeaJs，众多规范看起来实在头疼，好在es6要解决模块问题了
-
ES6Module
在之前众多非原生解决方案后，ES6提出module模块，以export，import方式来解决依赖问题。
但是目前浏览器还未支持，因此不能直接运行。一般使用babel将其转为浏览器能运行的版本（向过去转换）
-
特性
- ES6中，
import引入的依赖在编译时加载或称为静态加载
