问题描述
在使用 webpack-dev-server 进行开发时，有时候会遇到启动报错的情况，比如：
Error: Cannot find module 'webpack-cli/bin/config-yargs'
Error: listen EADDRINUSE: address already in use :::8080
这些报错会影响我们的开发效率，需要及时解决。
解决方案
1. 安装 webpack-cli
在上述报错中，出现了 Cannot find module 'webpack-cli/bin/config-yargs'，这是因为缺少了 webpack-cli 模块。
解决方法是通过 npm 安装 webpack-cli：
npm install webpack-cli --save-dev
2. 修改端口号
在上述报错中，出现了 listen EADDRINUSE: address already in use :::8080，这是因为端口号 8080 已经被占用了。
解决方法是修改 webpack-dev-server 的端口号，比如改为 8888：
"scripts": {
"start": "webpack-dev-server --port 8888"
}3. 清空缓存
有时候可能是 webpack-dev-server 缓存的问题，可以尝试清空缓存：
rm -rf node_modules/.cache/webpack-dev-server
4. 升级 webpack-dev-server 版本
如果以上方法都不能解决问题，可以尝试升级 webpack-dev-server 版本：
npm install webpack-dev-server@latest --save-dev
示例代码
-- -------------------- ---- -------
-- -----------------
-------------- - -
-- ---
---------- -
----- ----
-
--
-- ------------
-
---------- -
-------- ------------------- ------ -----
--
------------------ -
---------- ----------
-------------- ---------
--------------------- --------
-
-总结
在使用 webpack-dev-server 进行开发时，可能会遇到启动报错的情况，但是这些报错都有对应的解决方案。我们可以通过安装缺少的模块、修改端口号、清空缓存、升级版本等方法来解决问题。希望本文的内容对大家有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65e1af981886fbafa4ea17fe