webpack原理解析（三）plugin机制

背景

在之前的文章中，我们了解到了webpack的打包机制和loader，loader 用于转换某些类型的模块，而plugin则可以用于执行范围更广的任务。包括：打包优化，资源管理，注入环境变量。插件目的在于解决 loader 无法实现的其他事。所以我们很有必要探究一下webpack的plugin机制。

plugin是什么

在 Webpack 运行的生命周期中会广播出许多事件，Plugin 可以监听这些事件，在合适的时机通过 Webpack 提供的 API 改变输出结果。plugin是一个扩展器，在webpack打包的过程中，基于事件驱动的机制，监听webpack打包过程中的某些节点，从而执行广泛的任务。

基本插件架构

一个插件由以下构成：

• 一个具名 JavaScript 函数。
• 在它的原型上定义 apply 方法。
• 指定一个触及到 webpack 本身的 事件钩子。
• 操作 webpack 内部的实例特定数据。
• 在实现功能后调用 webpack 提供的 callback。

首先是写一个构造函数（此构造函数上的 prototype 对象具有 apply 方法），apply 方法可以接收一个 webpack compiler 对象的引用，从而可以在回调函数中访问到 compiler 对象。再就是构造方法，接收配置中