在webpack流行之前,前端开发模块化一直都是个老大难问题。例如说开发一个网站,我们会新建非常多的html页面,然后为了整洁会将页面的js分离出来做成一个一个的<script>标签,在html里面按顺序引入。
自然地就会造成维护与开发的困难,例如说不同的script之间如果有依赖关系,就必须按顺序放好,否则就会运行报错,在window挂载的全局变量可能会重复;此外,过多的script标签也会造成页面的阻塞。在这个背景下,AMD与CMD作为JS模块开发规范就产生了很大的作用了。
AMD的相关概念
AMD是什么
AMD(Asynchronous Module Definition,异步模块定义)是RequireJS在推广过程中的规范产物,可以说RequireJS就是AMD的一种实现。
AMD的特点
1. 支持异步加载,使用AMD规范加载的组件将会在异步模式下加载,所以不会堵塞其余的文件内容,但是也不能明确加载完成的时间(异步的特性),所以如果有同步模块依赖了AMD模块的话,使用的时候需要注意
2. 建议依赖前置,在使用AMD规范开发模块时,需要将依赖的组件放到文件头,加载成功后的会在全部模块异步加载完成后调用
CMD的相关概念
CMD是什么
CMD(Common Module Definition,通用模块定义)是SeaJS在推广过程中的规范产物,可以说SeaJS是CMD的一种实现
CMD的特点
1. 即用即加载,不需要在模块入口前置说明,只要模块是按照CMD规范开发的话,进行好模块名称配置后,可以直接在模块内直接通过SeaJS提供的require方法同步引入;当然也可以在定义的时候声明。
2. 可支持异步,SeaJS也提供了异步加载模块的方式