Webpack 从读取配置文件到生成打包产物经历了哪些过程

[ChuChencheng]

基于个人理解的过程，可能有疏漏或者错误的地方，欢迎指出

1. Webpack 根据命令行参数，读取配置文件，与默认的配置合并，得到最终的配置
2. 根据配置中的 entry ，得知打包的入口，可能是一个或者多个文件
3. 从入口文件开始解析，先交给对应 Loader 去处理，得到处理后的文件，例如入口是 ts 文件，处理后得到 js 文件
4. 将处理后的文件用 babel 库处理得到 AST ，根据 AST 可以得到该文件所引用的模块
5. 从文件引入的模块继续解析新的模块，重复3、4步骤，最后得到依赖图（dependency graph）
6. 根据入口文件和它的依赖，输出多个包含多个模块的 chunk ，可以根据 AST 生成最终的代码，期间也可能经过一些 Plugin 处理
7. 根据配置的路径输出最终生成的文件到文件系统

最后生成的 js 是怎么实现引用其他模块以及异步模块的，参照 #32

参考

• https://juejin.im/post/5e116fce6fb9a047ea7472a6