介绍webpack4的编译过程， 以及会触发的一些hooks。本文只是简单的展示webpack编译流水线，通过函数名调用，和hooks触发，可以了解大概流程。希望对编写webpack4插件的你带来帮助。 想了解具体实现的请移步看源码。
call 和 callAsync 的是事件触发
webpack4 的 hooks 继承自 webpack/tapable。 可以简单理解为一种订阅，分发的观察者模式。
webpack 内置插件会再各个编译流程中注册事件。 等待hook被call。
我们自己编写插件的话，可以在下面任意流程点注册事件，来改变编译的结果。
compiler.run() 为入口函数
Compiler 对象
- run()
- this.hooks.beforeRun.callAsync
- this.hooks.run.callAsync
- compile()
- this.hooks.beforeCompile.callAsync
- this.hooks.compile.call;
- new compilation()
- this.hooks.make.callAsync
- compilation.finish()
- compilation.seal
- this.hooks.afterCompile.callAsync
- onCompiled
- this.hooks.shouldEmit.call
- this.hooks.done.callAsync
Compilation 对象 (太多了。。省略很多 - -！）
- this.hooks.finishModules.call
- this.hooks.seal.call 编译的封存已经开始
- this.hooks.optimize.call 优化编译
- this.hooks.optimizeTree.callAsync 树的异步优化
- this.hooks.afterOptimizeTree.call
- this.applyModuleIds()
- this.sortItemsWithModuleIds()
- this.applyChunkIds()
- this.sortItemsWithChunkIds()
- this.createHash()
- this.hooks.additionalAssets.callAsync
- this.hooks.optimizeChunkAssets.callAsync
- this.hooks.afterSeal.callAsync
