Vue2热更新突然失效

之前Vue的热更新是可以是正常使用的，最近不知道哪里出了问题，热更新突然失效，然后查看了控制台也没有报错，就很奇怪。
然后尝试了重新下载node_modules也无济于事

问题已经解决了，经过排查是因为在Vue的index.html中加入了一个http升级https的属性，如图所示：


img




因为在生产环境使用的https协议，为了使所有 http 连接升级为 https 连接。所以在index.html加入了这个。
但是加入这个之后，因为在本地测试使用的是http协议，所以在浏览器控制台会报一个这样的错入，如下图所示：


img




然后点进去发现是这里报的错误，如图所示：


img




关于这个报错在网上查到的解释是：sockjs-node是一个JavaScript库，提供跨浏览器JavaScript的API，创建了一个低延迟、全双工的浏览器和web服务器之间通信通道。在项目运行以后，network会一直调用这个接口。如果没有使用，那么就一直会报这个异常。


经过测试发现这行代码是影响热更新的主要因素，如果这行代码出现异常，那么热更新就会失效。

所以最终的解决方案是，在本地测试时将这个http升级https属性注释掉，发布到生产环境时再将其打开。

看见有的网友大神回复说存在的情况，不知道你的是不是也会是这样
他们后来发现是项目本身的配置出现了问题，导致热更新失效，经过查看才发现是在开发环境的配置文件出现了错误，把错误调整好之后热更新就可以正常使用了。

把vue.config.js里的配置挨个删除
删着删着就可以了

组件名字写错了吧，大小写和路由配置表里面的一致

不知道你这个问题是否已经解决, 如果还没有解决的话:
  • 你可以参考下这个问题的回答, 看看是否对你有帮助, 链接: https://ask.csdn.net/questions/7501649
  • 我还给你找了一篇非常好的博客，你可以看看是否有帮助，链接：vue 彻底删除 node_modules 命令
  • 除此之外, 这篇博客: 纯内网环境开发vue,node_modules拷贝复制问题中的 方案一 部分也许能够解决你的问题, 你可以仔细阅读以下内容或者直接跳转源博客中阅读:

    当然是现在外网把node_modules全部下载好，然后拷贝给安全员，让他们通过相应流程发给内网的我们。

    下载依赖一定要用 npm install

    对比cnpm install 与 npm install的区别

    1、 npm install的node_modules
    在这里插入图片描述
    打开 @开头的文件目录
    在这里插入图片描述

    目录太多挑选不一样的目录格式截图

    2、cnpm install的node_modules目录
    在这里插入图片描述

    在这里插入图片描述
    在这里插入图片描述

    可以看到根目录，和@开头的文件下都有很多快捷方式。

    快捷方式是复制不过去真实引用文件的。

    复制过程如果依赖很多的话可以分多次复制

    解决访问慢的方法： npm设置淘宝代理

    npm config set registry https://registry.npm.taobao.org
  • 以下回答来自chatgpt:

    无法解决该问题。因为没有提供具体的代码和错误信息，无法确定具体的解决方案。建议尝试重新安装Vue.js和相关依赖，并检查控制台信息以确定错误原因。若问题仍然存在，建议向Vue.js的官方社区或其他技术社区提问，以获取更好的解决方案。


如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^