1. 初始化阶段（Initialization）

当运行webpack命令，它会先读取配置文件webpack.config.js，并于内部默认配置合并。接着，会实例化一个对象Compiler

2. 构建依赖图谱

• 寻找入口：webpack从你指定的entry文件开始
• 递归解析：它会读取入口文件的内容，找出所有的import和require语句
• 构建模块图：webpack会根据这些引用关系，递归的寻找所有依赖，直到所有文件被找齐，形成一张巨大的依赖图

3. 编译转换 在这个过程中，webpack并不会直接读源码，而是把文件交给Loader处理

   • AST解析：Webpack会将JS代码转换成抽象语法树（AST），从而理解内部代码的逻辑
   • Loader介入：每当遇到非JS文件（如CSS，TS、图片），webpack会调用配置好的loader，例如label-loader会把AST里的ES6语法降级为ES5
   • 转换结果：所有的模块都会转换成webpack能识别的js模块

4. 优化与封存

   • 代码分割：根据你的配置，把模块组合成不同的Chunks
   • 代干预：各种plugin开始发力，比如代码压缩、混淆变量、删除注释，或者通过tree shaking剔除代码

5. 输出资源 会根据chunk生成最终的资源文件（通常是dist目录下的.js`.css\.map`等文件）

   • 确定文件名：根据配置生成带有hash值的文件名（用于缓存控制）
   • 写入文件系统：把内存中的打包结果写入硬盘