插件是 webpack 的支柱功能。Webpack 自身也是构建于你在 webpack 配置中用到的相同的插件系统之上！
插件目的在于解决 loader 无法实现的其他事。Webpack 提供很多开箱即用的插件。

常用插件

clean-webpack-plugin

自动清理输出目录

html-webpack-plugin

自动生成使用 bundle.js 的 HTML

copy-webpack-plugin

拷贝文件到输出目录

用法

由于插件可以携带参数/选项，你必须在 webpack 配置中，向 plugins 属性传入一个 new 实例。
取决于你的 webpack 用法，对应有多种使用插件的方式。

配置方式

webpack.config.js

  1. const HtmlWebpackPlugin = require('html-webpack-plugin'); // 通过 npm 安装
  2. const webpack = require('webpack'); // 访问内置的插件
  4. module.exports = {
  5.     plugins: [
  6.         new webpack.ProgressPlugin(),
  7.         new HtmlWebpackPlugin({ template: './src/index.html' }),
  8.     ],
  9. };