webpack-dev-server v5迁移报错：_assetEmittingPreviousFiles属性无效

环境版本 #

• webpack - v5.90.3
• webpack-cli - v5.1.4
• webpack-dev-server - v5.0.2

我的webpack.config.dev.js配置 #

const path = require('path');
const webpack = require('webpack');

module.exports = {
  mode: 'development',
  devtool: 'cheap-module-source-map',

  devServer: {
    static: path.join(__dirname, 'public/'),
    devMiddleware: {
      publicPath: '/dist/'
    },
    port: 3000,
    hot: "only"

  },

  entry: [
    require.resolve('react-dev-utils/webpackHotDevClient'),
    paths.appIndexJs,
  ],
  output: {

    path: paths.appBuild,

    pathinfo: true,
    filename: 'SHSADCAA/static/js/bundle.js',
    chunkFilename: 'SHSADCAA/static/js/[name].chunk.js',
    publicPath: publicPath,
    devtoolModuleFilenameTemplate: info =>
      path.resolve(info.absoluteResourcePath).replace(/\\/g, '/'),
  },
  optimization: {
    splitChunks: {
      chunks: 'all',
      name: false,
    },
    runtimeChunk: true,
  },
  resolve: {
      process.env.NODE_PATH.split(path.delimiter).filter(Boolean)
    ),
      'react-native': 'react-native-web',
    },
    plugins: [
      PnpWebpackPlugin,
      new ModuleScopePlugin(paths.appSrc, [paths.appPackageJson]),
    ],
  },
  resolveLoader: {
    plugins: [
      PnpWebpackPlugin.moduleLoader(module),
    ],
  },
}

运行报错信息 #

无效的配置对象。Dev Server 使用了不符合API schema的配置对象初始化：

• options 包含未知属性 '_assetEmittingPreviousFiles'。有效属性包括：
  object { allowedHosts?, bonjour?, client?, compress?, devMiddleware?, headers?, historyApiFallback?, host?, hot?, ipc?, liveReload?, onListening?, open?, port?, proxy?, server?, setupExitSignals?, setupMiddlewares?, static?, watchFiles?, webSocketServer? }

场景说明 #

正在从webpack-dev-server v3迁移至v5，卡在这个错误上，需要解决方法。

解决方法 #

1. 移除旧的热加载客户端 #

webpack-dev-server v5已内置热加载功能，无需手动引入react-dev-utils/webpackHotDevClient。修改entry配置：

entry: [
  // 移除该行：require.resolve('react-dev-utils/webpackHotDevClient'),
  paths.appIndexJs,
],

2. 清理依赖并升级兼容版本 #

• 确保react-dev-utils版本适配webpack 5与webpack-dev-server 5，建议升级到最新兼容版。
• 删除node_modules目录和package-lock.json/yarn.lock文件，重新执行npm install或yarn install，清除依赖缓存。

3. 排查遗留的v3配置 #

检查webpack配置中是否存在webpack-dev-server v3的过时属性，比如已被static替代的contentBase、已移除的inline等，确保配置完全贴合v5的API规范。

原因说明 #

错误核心是旧版react-dev-utils/webpackHotDevClient会向devServer注入v3时代的私有属性（如_assetEmittingPreviousFiles），而webpack-dev-server v5的配置Schema不再允许这些未定义属性，导致校验失败。

内容的提问来源于stack exchange，提问作者Jason1998