webpack5+webpack-dev-server启动项目热更新失效/热更新无效,webpack5热更新无效【解决办法】

最近在玩 webpack5 项目的时候,使用 webpack-dev-server 的热更新失败了,刚开始是启动失败,后来是热更新失败,真的是很头疼,报错好解决Cannot find module ‘webpack-cli/bin/config-yargs‘ 这个错误如果使用的 webpack5 + webpack-cli4.+ 的话,启动方式就不能使用 webpack-dev-server config.js 这种方式启动了,需要使用 webpack serve 来启动 webpack-dev-server ,看手册上到处都是这个例子:
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

这里看一下为什么 webpack-dev-serverHMR 失效,或者说 热更新 无效,看一下无效的启动之后和有效启动之后的 network 截图对比:
在这里插入图片描述
在这里插入图片描述
可以看到无效是因为没有启动 websocket

这个问题看到了别人的一篇文章找到的解决办法 【查看】:
在这里插入图片描述
把 browserslist 删除掉就可以了,具体的后期再测试看到底是哪个数据引起的 websocket 没起作用

猜你喜欢

转载自blog.csdn.net/qq_38652871/article/details/112971502