webpack plugins 相关配置

1、html-webpack-plugin

// 模块的引入
const HtmlWebpackPlugin = require('html-webpack-plugin')

/**
 * html-webpack-plugin 的简单配置
 * 可以在打包结束后自动生成一个 index.html 文件，并将所有打包的静态文件挂载到该文件
 * 也可以自定义一个 html 文件作为模板
 */
new HtmlWebpackPlugin({
  template: path.resolve(__dirname, 'index.html')
})

2、clean-webpack-plugin

// 模块的引入
const { CleanWebpackPlugin } = require('clean-webpack-plugin')

/**
 * clean-webpack-plugin 的简单配置
 * 在打包之前清除已存在的打包文件，可以自动匹配到打包生成目录的路径
 */
new CleanWebpackPlugin({
  // 指定路径
  patterns: [
    { from: resolve('../public'), to: resolve('../dist') },
  ],
})