无法启动webpack-dev-server，寻求技术解决方案

你遇到的错误信息如下：

$ node ../../bin/env.js webpack-dev-server
[dev:main] 'webpack-dev-server' is not recognized as an internal or external command,
[dev:main] operable program or batch file.
[dev:main] events.js:291
[dev:main]       throw er; // Unhandled 'error' event
[dev:main]       ^
[dev:main]
[dev:main] Error: spawn webpack-dev-server ENOENT
[dev:main]     at notFoundError (C:\Users\Nil Amrutlal\Projects\dtnl-abn-aditium\node_modules\cross-env\node_modules\cross-spawn\lib\enoent.js:6:26)
[dev:main]     at verifyENOENT (C:\Users\Nil Amrutlal\Projects\dtnl-abn-aditium\node_modules\cross-env\node_modules\cross-spawn\lib\enoent.js:40:16)
[dev:main]     at ChildProcess.cp.emit (C:\Users\Nil Amrutlal\Projects\dtnl-abn-aditium\node_modules\cross-env\node_modules\cross-spawn\lib\enoent.js:27:25)
[dev:main]     at Process.ChildProcess._handle.onexit (internal/child_process.js:276:12)
[dev:main] Emitted 'error' event on ChildProcess instance at:
[dev:main]     at ChildProcess.cp.emit (C:\Users\Nil Amrutlal\Projects\dtnl-abn-aditium\node_modules\cross-env\node_modules\cross-spawn\lib\enoent.js:30:37)
[dev:main]     at Process.ChildProcess._handle.onexit (internal/child_process.js:276:12) {
[dev:main]   code: 'ENOENT',
[dev:main]   errno: 'ENOENT',
[dev:main]   syscall: 'spawn webpack-dev-server',
[dev:main]   path: 'webpack-dev-server',
[dev:main]   spawnargs: []
[dev:main] }

试试下面这些解决步骤：

• 本地安装依赖，放弃全局安装
  项目优先使用本地node_modules里的依赖，全局安装的版本可能和项目不匹配。执行命令：

  npm install webpack-dev-server webpack-cli --save-dev
  

• 修改package.json的scripts，指定本地可执行文件路径
  确保启动命令直接调用本地的webpack-dev-server，避免系统找不到。比如把scripts里的dev命令改成：

  "scripts": {
    "dev": "cross-env NODE_ENV=development ./node_modules/.bin/webpack-dev-server"
  }
  

  Windows环境下可以写成：

  "scripts": {
    "dev": "cross-env NODE_ENV=development node_modules\\.bin\\webpack-dev-server"
  }
  

• 清理缓存并重新安装依赖
  依赖缓存或冲突可能导致问题，执行以下操作：

  1. 删除node_modules文件夹和package-lock.json：

     # Windows
     rd /s /q node_modules && del package-lock.json
     # macOS/Linux
     rm -rf node_modules package-lock.json
     

  2. 重新安装依赖：

     npm install
     

• 检查版本兼容性
  webpack和webpack-dev-server版本必须匹配：

  • webpack 4.x → webpack-dev-server 3.x
  • webpack 5.x → webpack-dev-server 4.x
    比如如果你的webpack是4.x版本，安装对应版本的dev-server：

  npm install webpack-dev-server@3 --save-dev
  

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