webpack 构建流程 | 饶英俊（Royin）的个人博客

webpack 的构建流程是一个串行的过程，从启动构建流程到结束的过程如下所示：

1. 初始化参数。将配置文件（webpack.config.js）与 shell 中的参数合并到一起，得出最终的配置
2. 开始编译。通过第【1】步得到的最终配置来初始化 Compiler（编译器） 对象，以及注册所有配置的插件，最后吊用 Compiler 的 run 方法开始编译
3. 确定入口 。根据配置里的 Entry 找到所有的入口文件
4. 编译模块。从入口文件开始，调用所有配置的 Loader 来对模块进行翻译，再递归找出模块依赖的模块，直到所有入口依赖的模块都经过了处理
5. 完成模块编译。通过第【4】步后，得到了每个模块被翻译后的最终内容以及它们之间的依赖关系
6. 输出资源。根据入口和模块之间的依赖关系，组合成一个个包含多个模块的 Chunk ，再将每个 chunk 转换成单独的文件，添加到输出列表。此时也是 Webpack 提供的最后的修改输出内容的时机。
7. 完成资源输出。确定好要输出的内容后，根据配置中的 Output（输出）确定输出的路径以及文件名，最后将文件内容写入文件系统

该博客版权归饶英俊（Royin）所有，严禁抄袭，欢迎转载。如有反馈或建议等可通过邮箱联系我
本文链接：https://raoyingjun.github.io/2022/02/21/webpack%E6%9E%84%E5%BB%BA%E6%B5%81%E7%A8%8B/