错误:无法在webpack-cli 4.2.0中找到'webpack-cli/bin/config-yargs‘模块

Question

当我试图运行webpack-dev服务器时，它会出现错误。

Error: Cannot find module 'webpack-cli/bin/config-yargs'

我环顾四周，发现你不得不把剧本改成"webpack发球“，然后它给了我以下内容：

**webpack-cli无效配置对象。Webpack已使用与API架构不匹配的配置对象进行初始化。

• configuration.devtool应该匹配模式"^(inline-|hidden-|eval-)?(nosources-)?(cheap-(module-)?)?source-map$".webpack以来的重大变化5:开发工具的选择更加严格。请严格遵循模式中关键字的顺序。**

我的系统是Windows 10 Pro，版本如下：

webpack: 5.6.0

• webpack-cli: 4.2.0

• webpack-dev-server: 3.11.0

我还尝试将"inline: false“包含到devServer对象中的webpack.config.js中，但没有结果。

Answer 1

只需几步：

"dev": "webpack serve"

• set

• 在webpack.config.js

• then、run npm run dev或npx webpack serve

中添加脚本

• devtool: 'eval-source-map'

webpack v5 && webpack-cli v4应该使用webpack serve而不是webpack-dev-server

如果你运行npx webpack serve

configuration.devtool should match pattern "^(inline-|hidden-|eval-)?(nosources-)?(cheap-(module-)?)?source-map$". BREAKING CHANGE since webpack 5: The devtool option is more strict. Please strictly follow the order of the keywords in the pattern.**

您可以在devtool: 'eval-source-map'中设置webpack.config.js

通常用来平衡速度和调试：

在devtool: 'eval-source-map'

• in模式下我们使用production模式，我们使用devtool: 'cheap-module-source-map'模式

您还可以返回webpack v4 && webpack-cli v3或尝试npm i webpack-dev-server@4.0.0-beta.0 -D (请参阅https://github.com/webpack/webpack-dev-server/releases/tag/v4.0.0-beta.0 )

更多你能看到的问题

• https://github.com/webpack/webpack-cli/issues/1948
• https://github.com/webpack/webpack-dev-server/issues/2759

Answer 2

也许有人需要把devtool: 'cheap-module-eval-source-map'改为devtool: 'eval-source-map'