点击登录,精彩内容等着你

vscode修改vue文件,热更新失败,你想不到的原因

全栈侠客

2022-12-11
leanboot-vue3在开发过程中,/layout/Main.vue作为框架组件,由于import写错了路径的大小写,导致修改Main.vue后,热更新失败,一定要重启服务器才生效

由于一时疏忽,import的组件,路径是小写的,结果写错了为大写,结果悲剧了,导致修改该文件,热更新失败…

关联项目:leanboot-vue3,leanboot-micro

一、问题描述

leanboot-vue3工程,采用vite+vue3进行构建,框架组件/src/layout/Main.vue,在修改后,热更新失败,在终端中没有出现:[vite] hmr update …等


结果发现:路由import的Main.vue是路径大小写引起的

  1. //错误写法,layout写错为Layout
  2. import Main from '@/Layout/Main.vue';
  3. //1.公共路由
  4. export const commonRoutes = [
  5. {
  6. path: '',
  7. name: 'appIndex',
  8. component: Main,
  9. redirect: '/index',
  10. children: [
  11. {
  12. path: '/index',
  13. component: () => import('@/views/index'),
  14. name: 'index'
  15. }
  16. ]
  17. },
  18. ];
  19. //以上代码,会导致Main.vue热更新失败

二、总结

原来import命令使用,文件路径是区分大小写的

阅读 3531     最后编辑 2022-12-11 09:38
文章补充
评论(0) 发表新评论
  • ...暂无评论...

我是有底线的 评论与点赞5分钟更新一次
回复评论
取消关闭

请先登录