在前端Webpack中，compilation 和 compiler 是两个核心对象，它们在整个构建流程中扮演着不同的角色。理解它们的区别对于编写Webpack插件和深入理解Webpack工作原理至关重要。
Compiler (编译器)
Compiler 对象是Webpack的核心引擎 ，它代表了整个Webpack构建的生命周期。 12
-
全局性与生命周期 :
Compiler是一个全局单例对象，在Webpack启动时（无论是通过命令行接口CLI还是Node.js API）只创建一次，并贯穿整个Webpack的运行过程。 12 -
职责:
-
插件交互 : 大多数用户级别的Webpack插件会首先注册到
Compiler对象上，通过compiler.hooks.someHook.tap(...)的方式来监听和响应Webpack生命周期中的事件。 14 -
Tapable 继承 :
Compiler继承自Tapable类，这使得它能够通过发布-订阅模式来注册和调用各种钩子。 14
Compilation (编译)
Compilation 对象代表了Webpack一次具体的构建过程 。 25
-
局部性与生命周期 : 每当Webpack执行一次新的编译（包括在
watch模式下的每一次重新构建），都会创建一个全新的Compilation实例。 25 -
职责:
- 它是Webpack中执行实际构建工作的"心脏"或"大脑"。 2
- 它包含了当前构建过程的所有信息，例如模块、依赖、Chunk、生成的资源（assets）等。 25
- 它负责构建模块依赖图 ，解析模块间的依赖关系。 26
- 它负责编译模块，应用Loader对模块进行转换。
- 它负责生成Chunk ，并将模块组织到不同的Chunk中。 6
- 它负责优化 （如Tree Shaking、代码压缩等）。 4
- 它负责生成最终的输出文件 （assets）。 67
- 它提供了更细粒度的生命周期钩子 ，允许插件在模块处理、Chunk优化、资源生成等具体步骤中进行干预。 47 常见的钩子有
optimize,processAssets,addEntry等。 48
-
插件交互 : 插件通常在
Compiler的钩子中获取到Compilation实例，然后通过compilation.hooks.someHook.tap(...)来操作当前构建的细节，例如修改生成的资源、添加新的模块等。 47 -
子编译器 :
Compilation还可以创建子编译器（createChildCompiler），这允许在Webpack内部运行另一个Webpack实例，通常用于处理特殊资源或独立构建流程。 69
总结区别
| 特性 | Compiler (编译器) | Compilation (编译) |
|---|---|---|
| 角色 | Webpack的全局协调者 ，代表整个构建环境。 12 | 单次构建的执行者 ，代表一次具体的编译过程。 25 |
| 生命周期 | 在Webpack启动时创建一次，贯穿整个运行周期。 12 | 每次构建（包括watch模式下的重编译）都会创建新的实例。 25 |
| 职责范围 | 负责整体配置、文件监听、创建Compilation实例等高层级任务。 13 |
负责模块的解析、加载、转换、依赖图构建、Chunk生成、优化和资源输出等具体构建任务。 26 |
| 钩子粒度 | 提供高层级的生命周期钩子（如 run, done）。 13 |
提供更细粒度的构建流程钩子（如 processAssets, optimize）。 48 |
| 获取方式 | 通过Webpack的Node.js API直接获取，或在插件的apply方法中作为参数传入。 27 |
在Compiler的某些钩子中（例如compiler.hooks.compilation.tap）作为参数传入。 47 |
简而言之，Compiler 就像一个项目经理 ，负责启动和管理整个项目（Webpack构建过程），而 Compilation 则像一个具体任务的执行团队，负责完成项目中的每一个详细任务（模块编译、打包、优化等）。每次项目经理启动一个新项目或重新开始一个项目时，都会组建一个新的执行团队。