Vue-cli@4.x sockjs-node/info失败导致无法热更新

13 篇文章 0 订阅

最近在写基于vue-cli@4.5写Vue3项目,写着写着发现不太对劲,每次我修改了*.vue文件后都自己手动刷新才显示新修改的内容,我一直记得vue2项目都是有热更新的,而且到Vue3官方文档也说明了脚手架安装的项目自带热更新,拆箱即用
在这里插入图片描述

一开始我以为是我项目写的过程中修改了某些配置,导致热更新失败了,我又重新创建了一个vue3项目

结果项目启动后依旧没有热更新,我打开network一看,居然有一堆报错,因为是sockjs.js,所以我猜测我的热更新失败因该是和这个有关
在这里插入图片描述

在这里插入图片描述

我的报错信息,我看了这个请求的 IP 地址,使用的外部地址,排查了一下该请求应该是走了代理,而我的外部地址并非公网 IP,所以代理之后的请求一定会得不到响应而失败。

那么解决方法就是告诉他我的地址是什么,在vue.config.js中

devServer: {
    public: '0.0.0.0:8080',
    port: 8080,
}

重新启动项目,发现热更新可以了,而且network中不再显示sockjs报错,而是显示hot-update

因为平时我写vue2项目的时候一般只写了port而没有写public,所以这次vue3的热更新还是开箱即用,一次蛮有意思的折腾,记录一下

  • 7
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值