vite保存后页面不更新

已于 2022-08-31 15:52:34 修改
阅读量1.5k 收藏 3
点赞数 5
文章标签： vue.js 前端
于 2022-08-31 15:49:42 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43932597/article/details/126625330
版权

vite@3.0.9

问题：

把a改成b，保存后疯狂刷新，页面就是始终显示a
重新 run dev，就会显示b
如果再改成c，刷新，页面还是b

控制台没有任何警告、错误提示
......

原因：

有人把项目部分文件名的大写换成小写了，比如
page/Home.vue  ===> page/home.vue

代码改了，ok，没问题，我pull下来了
但是文件的名字还是大写的Home............

hnxycxd
关注
  • 5
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
vite-plugin-full-reload::recycling_symbol:修改文件后自动重新加载页面
05-12
修改文件后自动重新加载页面 为什么？ :thinking_face: 使用，我想查看服务器渲染的布局和模板的更改，而无需手动重新加载页面。 另外，在中，当触发Rails重装时会生成路径帮助器。 修改config/routes.rb时触发...
vite-plugin-sfc-reload:Vite的一个非常特定的插件，它监视Drupal SFC文件的更改并在模板更新时重新加载
03-29
该插件将监视SFC文件中的更改，并将更改后的组件名称发布到sfc/compile回调中，后者随后将报告该文件的哪个部分已更新。 然后，插件确定HMR是否足够（因为HMR已经处理，它什么都不做），还是应该触发显示模板更改所...
vite搭建的vue项目，保存后项目不会自动更新
m0_57996540的博客
06-30 1199
在vite.config.js配置好了热加载hmr，由于router中component引用的路径不小心写错，把大写的写成了小写，导致保存后，项目不会自动刷新。
vite无法自动更新问题
qq_54334713的博客
03-11 563
vite无法自动更新问题
vite3+vue3 HMR热更新无效 页面无法局部自动更新（需手动刷新页面）的问题解决
最新发布
m0_49280365的博客
07-11 1344
开发vite3+vue3项目 HMR 热更新无效、页面不能局部自动更新（需手动刷新页面）的问题。Vite和Vue版本不兼容。
Vite热更新失效
Ly
03-14 3884
vite热更新无效的解决办法，vue3+vite不热更新的解决方案，vue3+vite热更新失效问题，vue3无法热更新，1、每次更新代码都要重启项目是全量热更新的问题，如文件大小写问题、同一个文件夹下存在大驼峰小驼峰的命名方式的2种文件。 2、如果刷新页面会更新，可以确认一下vite.config.js内有无配置server:{hmr:true} 3、如果是页面级组件出现问题，极有可能是路由的文件或命名问题，引用组件则是组件引用地址和组件文件的写法问题！
Vue3+vite项目，保存代码后页面不刷新
海风依旧
10-20 3606
问题描述：Vue3+vite项目，ctrl+s保存代码后，页面不刷新，在vite.config.js配置了热加载hmr也没用，只能通过yarn dev重新打开
vite项目修改依赖不更新，清除依赖缓存
苦夏木禾
03-02 9644
vite项目修改依赖不更新，清除依赖缓存
vite搭建three.js的开发环境
01-06
只需保存文件，浏览器会自动刷新，展示更新后的3D效果。 通过这个基础的Vite和Three.js配置，你可以开始探索Three.js的无限可能，创建令人惊叹的3D应用程序。记住，不断学习和实践是提升技能的关键。在你探索的过程...
Vue 3 + NaiveUi + pinia + Vite
03-25
Vite 是由 Vue.js 作者尤雨溪开发的新型前端构建工具，它利用了ES模块的原生导入功能，实现了快速的热更新和按需编译，极大地提高了开发效率。Vite 内置了 Rollup，可以轻松打包应用，并且支持 TypeScript 和预...
Electron+Vue+Vite+ElementPlus 实战
10-19
Electron+Vue+Vite+ElementPlus 实战。 使用Vue+Vite+ElementPlus搭建页面，然后通过electron将页面的表单信息保存到本地config.properties文件中。
vite-mdx:在Vite中使用mdx的示例
03-21
保存所有更改，然后在终端中运行`npm run dev`启动Vite的开发服务器。浏览器将自动打开，你将看到MDX文件中的Markdown文本和React组件被正确地渲染出来。 通过以上步骤，你已经在Vite项目中成功集成了MDX。这使你...
vue3-vite-eslint-prettier-h5-template:vue3 vite eslint漂亮的h5模板
03-08
Vue3-Vite-Eslint-Prettier-H5-Template 是一个专门为开发现代H5页面而设计的项目模板，集成了Vue3、Vite、Eslint、Prettier等前端开发工具，旨在提供一个高效、规范的开发环境，帮助开发者快速启动新项目。...
vite2-project:vite2的一个项目
04-07
2. **热模块替换（HMR）**：Vite2 提供了高效且无刷新的热模块替换功能，只需要修改代码并保存，更改的部分会立即在浏览器中反映出来，而无需整个页面刷新，提高了开发效率。 3. **预构建（Build）优化**：虽然在...
vue3-vite
03-08
2. **即时重载**：Vite在开发模式下提供即时热更新，修改保存后，只有相关部分会重新编译并刷新，无需整个项目重新构建，提高了开发效率。 3. **预构建优化**：虽然Vite在开发时速度快，但生产环境同样能得到优化。...
zipe:Vite + SSR =拉链
03-20
HMR与vite相同，因此无需重新加载页面，仅更新已更改的组件。 在职的 概念证明 带HMR的SSR 在SFC中导入js / ts文件 CSS范围 异步导入 无法运作 HMR在第一个文件更改时，仅在大于1个保存时起作用 目前暂无build支持 ...
【问题】如何解决vite+vue3搭建的工程热更新失效问题
freeGameBox的博客
06-02 4173
vite是一个基于ESM的轻量级前端开发工具，它可以快速地启动项目，实现模块热更新，提高开发效率。vue3是vue的最新版本，它引入了许多新特性，如组合式API，响应式数据源等。vite和vue3可以很好地配合使用，创建现代化的前端应用。然而，在使用vite+vue3搭建工程时，有时会遇到热更新失效的问题，即修改了代码后，页面没有及时刷新，需要手动重启项目才能看到效果。那么，如何解决这个问题呢？以上就是一些可能的原因和解决方法，希望对你有所帮助。如果你还有其他的问题或建议，请在评论区留言。
Vue3+vite项目，保存页面不刷新，重启才刷新问题
jiang1726817390的博客
05-17 2206
大写写成小写不会报错，而且重启才有效，导致排查了很久，所以写代码要细心。router中component引用路径大写的写成了小写。
vite热更新失效解决方法
Hushingiwkw的博客
06-26 1698
一、可能出现这种情况是因为vite热更新机制的问题，因为在热更新过程中，有可能会出现缓存未清除的情况，导致浏览器页面不能同时更新。添加以上代码后，打包时会生成一个新的chunk文件，文件名为everything.js，这样就禁用了浏览器缓存。当我们正常写代码的时候，保存时浏览器显示的页面，用vite应该是同时进行的，但此时需要重启项目，这样就不对了。以上配置中，我们将端口设置为了443，这样可以避免缓存未清除的情况。在浏览器中清除缓存，重新加载页面。
vite 热更新 怎样提升 效率的
06-22
Vite 使用了基于浏览器的 Server-Side Rendering (SSR) 和高效的 HtmlWebpackPlugin 配合，实现了近乎实时的代码更改后的页面刷新，显著提高了开发效率。 以下是 Vite 热更新如何提升效率： 1. **即时编译**：Vite...
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值