# Webpack本质
Webpack本质上一种基于事件流的编程范例，其实就是一系列的插件运行
Webpack主要使用Compiler和Compilation两个类来控制Webpack的整个生命周期。他们都继承了Tapabel并且通过Tapabel来注册了生命周期中的每一个流程需要触发的事件
# Tapabel
Tapabel是一个类似于Node.js的EventEmitter的库，主要是控制钩子函数的发布与订阅，是Webpack插件系统的大管家
Tapabel提供的钩子及示例
Tapable库为插件提供了很多 Hook以便挂载。
const {
SyncHook, // 同步钩子
SyncBailHook, // 同步熔断钩子
SyncWaterfallHook, // 同步流水钩子
SyncLoopHook, // 同步循环钩子
AsyncParalleHook, // 异步并发钩子
AsyncParallelBailHook, // 异步并发熔断钩子
AsyncSeriesHook, // 异步串行钩子
AsyncSeriesBailHook, // 异步串行熔断钩子
AsyncSeriesWaterfallHook // 异步串行流水钩子
} = require("tapable");
@前端进阶之旅: 代码已经复制到剪贴板
Tabpack提供了同步&异步绑定钩子的方法，方法如下所示：
| Async | Sync |
|---|---|
绑定：tapAsync/tapPromise/tap |
绑定：tap |
执行：callAsync/promise |
执行：`call |
Tabpack简单示例
const demohook = new SyncHook(["arg1", "arg2", "arg3"]);
// 绑定事件到webpack事件流
demohook.tap("hook1",(arg1, arg2, arg3) => console.log(arg1, arg2, arg3)) // 1 2 3
// 执行绑定的事件
demohook.call(1,2,3)
@前端进阶之旅: 代码已经复制到剪贴板
# 源码解读
1. 初始化启动之Webpack的入口文件
- 追本溯源，第一步我们要找到
Webpack的入口文件。 - 当通过命令行启动Webpack后，
npm会让命令行工具进入node_modules.bin目录。 - 然后查找是否存在
webpack.sh或者 webpack.cmd 文件，如果存在，就执行它们，不存在就会抛出错误。 - 实际的入口文件是：
node_modules/webpack/bin/webpack.js，让我们来看一下里面的核心函数。
// node_modules/webpack/bin/webpack.js
