webpack-plugin篇

2、webpack核心模块——tapable

tapable 是 webpack 的一个核心工具，但也可用于其他地方，以提供类似的插件接口。tapable模块中暴露了Hook类，pugins都是注册在Hook的实例化对象上，这个类暴露 tap, tapAsync 和 tapPromise 方法，webpack中的插件会将所需执行的函数通过tap 、tapAsync 、tapPromise等方法注册到对应钩子上。这样，webpack调用相应钩子时，散落在各文件的插件就会自动执行

插件类型：同步事件（sync）、异步并行事件（asyncParallel）、同步串行事件（asyncSeries）

compiler对象——hooks（对应的编译周期详情见https://www.webpackjs.com/api/compiler-hooks/）

sync插件用法及原理：

      1、事件注册

usage : compiler.hooks.beforeRun.tab( option , fn ) 

option : String || Object = { name:xxx , before:String || [] , stage:number }

option支持String或Object格式，如果传入对象，必须写name属性，相当于string；before:注册的插件在哪些插件的前面，值可为string=>xxxplugin.name或者 [xxxplugin.name,xxxplugin2.name,...arg];stage:权重，权重大的排在事件管理中心的后面，默认stage=0。

      2、事件触发

      compiler.hooks.beforeRun.callAsync(compiler,()=>{})

    基本原理：