1. 简介
介绍模块打包工具
2. 什么是模块
关于模块和模块化,百度百科有一段引用自《Java应用架构设计:模块化模式与OSGi》一书的解释非常好:
在系统的结构中,模块是可组合、分解和更换的单元。模块化是一种处理复杂系统分解成为更好的可管理模块的方式。它可以通过在不同组件设定不同的功能,把一个问题分解成多个小的独立、互相作用的组件,来处理复杂、大型的软件。
3. 常用模块规范
常用的模块规范有如下几种:
- commonjs:
使用module.exports或者exports导出,使用require加载。代表:node - amd:
使用define定义模块,使用require加载,依赖前置。代表:requirejs - cmd
使用define定义模块,使用require加载,就近依赖。代表:seajs - esmodule
export导出,import加载。推荐写法。
3. 演示
演示了commonjs的写法。不在此列举。
4. 模块打包工具
顾名思义,就是用来分辨模块的依赖关系,组织模块代码的工具。对于webpack模块,有着更广泛的类型支持,不仅仅是js模块而已。(虽然本质上还是先翻译成js模块,但是形式上支持各种类型的模块)。
总的来说,webpack 提供了可定制的、强大和丰富的 API,允许任何技术栈使用 webpack,保持了在你的开发、测试和生成流程中的无侵入性(non-opinionated)。
5. 作业
参考
js模块化
JS模块化
什么是js模块化?js模块化的介绍
模块(modules)
webpack模块化原理-ES module
深入理解JS模块
百度百科-模块化
JavaScript模块化(ES Module/CommonJS/AMD/CMD)