【手把手教学webpack5】webpack配置底层逻辑

Webpack 的打包过程

过程非常复杂，但大致上可简化为
1.输入：从文件系统读入代码文件；
2.模块递归处理：调用 Loader 转译 Module 内容，并将结果转换为 AST，从中分析出模块依赖关系，进一步递归调用模块处理过程，直到所有依赖文件都处理完毕；
3.后处理：所有模块递归处理完毕后开始执行后处理，包括模块合并、注入运行时、产物优化等，最终输出 Chunk 集合；
4.输出：将 Chunk 写出到外部文件系统；

从上述打包流程角度，Webpack 配置项大体上可分为两类：

流程类：作用于打包流程某个或若干个环节，直接影响编译打包效果的配置项
工具类：打包主流程之外，提供更多工程化工具的配置项