启动 webpack-dev-server 时报错 Cannot find module 'webpack-cli/bin/config-yargs'

240 阅读1分钟

已安装的Node.js和主要相关模块是:

node.js v14.15.3

npm 6.14.9

webpack-cli 4.2.0

webpack 5.11.0

webpack-dev-server 3.11.0

启动 web-dev-server 的命令行为 :

npx webpack-dev-server --open

执行结果如下图:

问题的原因多半是 webpack 和 webpack-dev-server 之间的版本兼容问题。网友的解决方案也多是强制指定特定的版本,如:

"devDependencies": {
    "webpack": "^5.2.0",
    "webpack-cli": "^3.3.12",
    "webpack-dev-server": "^3.11.0"
}

感觉此方法很是尴尬,就多滤了几条,在 stackoverflow 上看到这样一句 : You could try changing webpack-dev-server to webpack serve in your npm run script inside package.json. 后面还有一句这样的评论:This is a useful answer particular when your project has these versions webpack": "^5.2.0 webpack-cli": "^4.1.0 webpack-dev-server": "^3.11.0.

于是用下面的命令行试了一下,果然奏效:

npx webpack serve --open

后来查看 webpack 5.11 英文版的官方文档中的 Using webpack-dev-server 部分, 发现它使用的 npm 脚本也是这么使用的:

 { ......
   "scripts": {  ......
     "start": "webpack serve --open"
   }, 
  ......
 }

再看对应的中文翻译,原来是没跟着修正过来 .....