umi webpack - configuration[0] has an unknown property 'experiments'

现象

umi项目启动时报错：

PS C:\xxx> yarn start:dev
yarn run v1.22.10
$ cross-env REACT_APP_ENV=local MOCK=none UMI_ENV=dev umi dev
Bundle with webpack 5...
Starting the development server...
Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
 - configuration[0] has an unknown property 'experiments'. These properties are valid:
   object { amd?, bail?, cache?, context?, dependencies?, devServer?, devtool?, entry?, externals?, infrastructureLogging?, loader?, mode?, module?, name?, node?, optimization?, output?, parallelism?, performance?, plugins?, profile?, recordsInputPath?, recordsOutputPath?, recordsPath?, resolve?, resolveLoader?, serve?, stats?, target?, watch?, watchOptions? }
WebpackOptionsValidationError: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
 - configuration[0] has an unknown property 'experiments'. These properties are valid:
   object { amd?, bail?, cache?, context?, dependencies?, devServer?, devtool?, entry?, externals?, infrastructureLogging?, loader?, mode?, module?, name?, node?, optimization?, output?, parallelism?, performance?, plugins?, profile?, recordsInputPath?, recordsOutputPath?, recordsPath?, resolve?, resolveLoader?, serve?, stats?, target?, watch?, watchOptions? }
    at Object.webpack (C:\xxx\node_modules\@umijs\deps\compiled\webpack\4\bundle4.js:138983:9)
    at Bundler.setupDevServerOpts (C:\xxx\node_modules\@umijs\bundler-webpack\lib\index.js:193:40)
    at C:\xxx\node_modules\@umijs\preset-built-in\lib\plugins\commands\dev\dev.js:300:30
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (C:\xxx\node_modules\@umijs\preset-built-in\lib\plugins\commands\dev\dev.js:74:103)
    at _next (C:\xxx\node_modules\@umijs\preset-built-in\lib\plugins\commands\dev\dev.js:76:194)

原因

使用了webpack5的高版本umi(如3.5.7）的问题，

解决

方案一

感谢：react umi项目运行报错 提供的帮助

降低版本后可行

项目中package.json中umi包版本如下：

"dependencies": {
  //```
  "umi": "^3.4.1",
  //···
}

去掉^
重新装包yarn或yarn install
重新启动项目

报错Cannot find module 'webpack/lib/ModuleFilenameHelpers':

Error: Cannot find module 'webpack/lib/ModuleFilenameHelpers'
Require stack:
- C:\xxx\node_modules\esbuild-loader\dist\minify-plugin.js
- C:\xxx\node_modules\esbuild-loader\dist\index.js
- C:\xxx\node_modules\@umijs\plugin-esbuild\lib\index.js
- C:\xxx\node_modules\@umijs\core\lib\Service\utils\pluginUtils.js        
- C:\xxx\node_modules\@umijs\core\lib\Service\Service.js
- C:\xxx\node_modules\@umijs\core\lib\index.js
- C:\xxx\node_modules\umi\lib\ServiceWithBuiltIn.js
- C:\xxx\node_modules\umi\lib\forkedDev.js
    at Function.Module._resolveFilename (node:internal/modules/cjs/loader:941:15)
    at Function.mod._resolveFilename (C:\xxx\node_modules\@umijs\bundler-webpack\lib\requireHook.js:49:28)
    at Function.Module._load (node:internal/modules/cjs/loader:774:27)
    at Module.require (node:internal/modules/cjs/loader:1013:19)
    at require (node:internal/modules/cjs/helpers:93:18)
plugin.js:8:33)
    at Module._compile (node:internal/modules/cjs/loader:1109:14)
    at Module._compile (C:\xxx\node_modules\@umijs\deps\compiled\babel\bun    at Module._extensions..js (node:internal/modules/cjs/loader:1138:10)
    at Object.newLoader [as .js] (C:\xxx\node_modules\@umijs\deps\compiled\babel\bundle.js:146843:7)
    at Module.load (node:internal/modules/cjs/loader:989:32)
    at Function.Module._load (node:internal/modules/cjs/loader:829:14)
    at Module.require (node:internal/modules/cjs/loader:1013:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at Object.<anonymous> (C:\xxx\node_modules\esbuild-loader\dist\index.js:10:41)

运行npm link webpack解决

方案二

全局搜索并去掉项目中的webpack5配置项

方案三

低版本umi的同学提交一下yarn.lock文件，新装同学重新yarn install