wp-plugin

plugins 插件

plugin 可以做很多事情 plugin 永远的神
在特定的时间做特定的事情

clean-webpack-plugin

作用：每次webpack编译之前删除dist里面的文件

html-webpack-plugin

1. 动态的给dist中创建html，默认引入main.js
2. 添加配置项
3. 

   DefinePlugin

   是webpack 内置的 插件
   获取方式 ： const { DefinePlugin } = require(‘webpack’);

使用：

ReactRefreshWebpackPlugin

const ReactRefreshWebpackPlugin = require("@pmmmwh/react-refresh-webpack-plugin");

配合 react-refresh 实现 HMR 热更新

其他插件

terser-webpack-plugin （terser 简洁的）

const TerserPlugin = require('terser-webpack-plugin');
module.exports = {
  optimization: {
    minimizer: [
      new TerserPlugin({
        cache: true,
        parallel: true,
        sourceMap: true, // 如果在生产中使用源映射，必须设置为true
        terserOptions: {
          // https://github.com/webpack-contrib/terser-webpack-plugin#terseroptions
        }
      }),
    ],
  }
};