合肥網(wǎng)站建設(shè)找佳達百度seo服務(wù)方案
? ? ? ?前段時間開發(fā)新的項目,由于沒有技術(shù)上的限制,所以選擇了vite+vue3+ts來開發(fā)新的項目,一開始用vite來開發(fā)新項目過程挺順利,確實比vue2+webpack的項目高效些(為什么選擇vite),但是過了一段時間后,不過怎么操作頁面修改頁面都無法及時刷新預(yù)覽頁面,各種糾結(jié)。
? ? ? ? 我覺得這是一個坑,為啥,請看下面的描述
????????
? ? ? ? ?按理說,我們無需要關(guān)心這些額外的配置,但是現(xiàn)在確實影響到了我們的開發(fā)體驗,官網(wǎng)上也沒明確描述,仔細想想是什么原因?qū)е铝藷o法熱更新的問題,因為剛搭建完工程開發(fā)的時候確實是可以熱更新的,仔細想了想發(fā)現(xiàn)好像是添加完路由出現(xiàn)這個問題的,猜想如果沒有路由是不是可以熱更新呢,于是在App.vue中修改代碼發(fā)現(xiàn)確實可以及時熱更新,現(xiàn)在可以基本上可以確定是路由問題的啦,各位可以自己試下。
? ? ? ? 怎么解決呢, 網(wǎng)上基本的解決方案是:router 路由中名稱和引入文件路徑及文件名需要保證大小寫一致,但是我仔細對比了下,發(fā)現(xiàn)我項目中路由引用的路徑名稱沒有寫錯,再次陷入思考,到底是啥原因,那么只有可能是引入組件的方式不一致(因為我的路由頁面特別簡單只引入了一個頁面),于是將路由引入的方式由靜態(tài)的改為動態(tài)的,管用了,但是想不明白,問題確實解決了。
? 靜態(tài)的寫法(不刷新)
import Index from '@/views/index.vue'
const routes = [{path: '/', component: Index}
]
? ?動態(tài)的寫法(刷新)
const routes = [{path: '/', component: () => import('@/views/index.vue')}
]
?至此,我的問題解決,下面來看其他導(dǎo)致沒有熱更新的問題
1、vite.config.ts沒有配置熱更新為false,改正
server: {hmr: true,//vue3 vite配置熱更新不用手動刷新}
2、一次性出現(xiàn)了過多的錯誤,這種情況一般出現(xiàn)在我們從別的地方復(fù)制一大段代碼然后修改,即便是把所有的錯誤都解決了,熱更新也失效,這種情況得重啟服務(wù)。
3、長時間修改頁面未重啟過服務(wù)也會導(dǎo)致熱更新失效,這種情況也得重啟服務(wù)。
4、一些配置文件的修改也不會實時更新,需要我們重啟服務(wù)
changed tsconfig file detected: E:\****\tsconfig.json - Clearing cache and forcing full-reload to ensure TypeScript is compiled with updated config values.