webpack5 配置热更新失效问题

 这是关于webpack的版本信息：

"webpack": "^5.37.0",
"webpack-bundle-analyzer": "^4.5.0",
"webpack-cli": "^4.9.0",
"webpack-dev-server": "^3.11.2",
"webpack-merge": "^5.7.3",
"webpackbar": "^5.0.0-3"

在webpack.dev.conf.js已经配置了 hot:true，但是热更新依旧无效：

devServer: {
    clientLogLevel: 'warning',
    historyApiFallback: {
      rewrites: [
        { from: /.*/, to: path.posix.join(config.dev.assetsPublicPath, 'index.html') },
      ],
    },
    hot: true, //开启热更新
    contentBase: false, // since we use CopyWebpackPlugin.
    compress: true,
    host: HOST || config.dev.host,
    port: PORT || config.dev.port,
    open: config.dev.autoOpenBrowser,
    overlay: config.dev.errorOverlay
      ? { warnings: false, errors: true }
      : false, //是否输出错误信息 
    publicPath: config.dev.assetsPublicPath,
    proxy: Object.assign(porxyStatic(), config.dev.proxyTable, multiConfig.process.proxyTable),
    quiet: true, // necessary for FriendlyErrorsPlugin
    useLocalIp: true,//用本地ip
    watchOptions: {
      poll: config.dev.poll,
    }
  },
// webpack 将生成 web 平台的运行时代码，并且只使用 ES5 相关的特性。
target: ['web', 'es5'],

原因是最后一行配置的编译成es5 ：

target: ['web', 'es5']
//webpack 将生成 web 平台的运行时代码，并且只使用 ES5 相关的特性。

这个版本的webpack貌似存在这个bug，编译成es5后热更新失效。

想要本地热更新开启并且保持编译成es5，就要dev和prod分开设置：

webpack.dev.conf.js：

target: 'web',//本地设置成web

webpack.prod.conf.js：

target: ['web', 'es5'],//正式环境打包编译成es5

这样本地保持热更新但是不编译成es5，线上打包编译成es5。本地需要使用es6的建议安装@babel/polyfill