我的编程空间,编程开发者的网络收藏夹
学习永远不晚

Vue Vite热更新不起作用的正确解决办法

短信预约 -IT技能 免费直播动态提醒
省份

北京

  • 北京
  • 上海
  • 天津
  • 重庆
  • 河北
  • 山东
  • 辽宁
  • 黑龙江
  • 吉林
  • 甘肃
  • 青海
  • 河南
  • 江苏
  • 湖北
  • 湖南
  • 江西
  • 浙江
  • 广东
  • 云南
  • 福建
  • 海南
  • 山西
  • 四川
  • 陕西
  • 贵州
  • 安徽
  • 广西
  • 内蒙
  • 西藏
  • 新疆
  • 宁夏
  • 兵团
手机号立即预约

请填写图片验证码后获取短信验证码

看不清楚,换张图片

免费获取短信验证码

Vue Vite热更新不起作用的正确解决办法

解决方案:

提示:文件夹名称严格注意大小写

router 路由中名称 和文件夹(目录), 文件名需要保证大小写一致

正确示例:

 {
                path: 'show',
                component: () => import("@/views/show/index.vue"),
 }

show 目录名
index.vue 文件名
这样大小写都是与路由中一致的就不会出现问题

错误示例:

 {
                path: 'show',
                component: () => import("@/views/Show/index.vue"),
 }

show 目录名 (注意路由中是大写开头,这里是小写的,这就是问题所在)

Index.vue 文件名

这样写目录名或文件名与路由中写的大小写不一致就会出问题

这种情况的话如果不想改目录或文件名,可以修改路由中目录名或文件名

注意:

目录或文件名有驼峰命名的时候也一样需要注意大小写

附:vue3+vite不热更新的解决方案

今天打开项目,更改了vue文件,发现项目不热更新,每次修改样式或者方法,都不会热更新,每次都需要刷新一下浏览器.

在网上搜了一下解决方案,大多数的解决方案都是一样,就是检查路由的,文件名和导入路径名是否大小写一致,检查了一番,路由名字都是一致的,不存在大小写不同的情况

最终问题=>竟然是vite.config.js里面将Server的hmr属性设置成了false,这样,每次启动服务都不会进行连接热更新

将hmr 设置成true,问题解决了,项目可以热更新了

总结

到此这篇关于Vue Vite热更新不起作用的文章就介绍到这了,更多相关Vite热更新不起作用内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网!

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

Vue Vite热更新不起作用的正确解决办法

下载Word文档到电脑,方便收藏和打印~

下载Word文档

猜你喜欢

探讨Vue占位符不起作用的原因和解决方法

Vue是一个流行的前端框架,用于构建现代化的Web应用程序。它提供了各种功能,例如数据绑定、组件化、路由、状态管理和构建工具等。在Vue中,占位符是一种常见的技术,用于展示模板中的数据或组件,但有时它可能不起作用。在本文中,我们将探讨Vue占位符不起作用的原因和解决方法。一、Vue占位符的使用在Vue中,占位符是一种特殊的语法,用双大括号表示({{ expression }})
2023-05-14

Win8应用商店收不到应用更新提醒的问题的解决办法

Win8系统应用商店收不到应用更新提醒的问题 不管是iphone或者Android手机或者Windows Phone的手机,当你下载的应用程序 有新版本,需要更新的时候都会收到推送的通知! Windows 8的系统也有这么个特性,当你下载的
2022-06-04

Win10一周年更新版重大bug摄像头不能用的解决办法

我们曾报道过Win10一周年更新版导致摄像头“瞎眼”失灵的问题。这是由于微软为了追求系统性能而主动“阉割”掉了MJPEG和H264基本码流,微软表示在问题解决后就恢复这两个码流的支持。 软媒魔
2023-05-21

编程热搜

目录