如何正確解決VuePress本地訪問出現(xiàn)資源報(bào)錯(cuò)404的問題
背景
最近發(fā)現(xiàn)好多小伙伴剛用VuePress，然后一build完就直接用本地瀏覽器訪問，結(jié)果出現(xiàn)黑塊。僅僅出現(xiàn)那種問題還好，給項(xiàng)目安裝 vuepress-plugin-serve 插件就行了，
但是如果有需求是需要離線查看 VuePress 生成后的文檔呢？所以我特地研究了一下——
解決辦法
打開 .vuepress/config.js 文件，把 base 的值改成 ./，為了方便調(diào)試，最好這樣寫：
//base: "/", base: "./",
寫兩個(gè)，一個(gè)用于Dev，一個(gè)用于Build。
然后打開項(xiàng)目下的 node_modules\@vuepress\core\lib\client 下的 app.js 文件，找到下方這個(gè)片段：
const router = new Router({
base: routerBase,
mode: 'history',
fallback: false,
routes,
scrollBehavior (to, from, savedPosition) {
if (savedPosition) {
return savedPosition
} else if (to.hash) {
if (Vue.$vuepress.$get('disableScrollBehavior')) {
return false
}
return {
selector: decodeURIComponent(to.hash)
}
} else {
return { x: 0, y: 0 }
}
}
})
把 mode: 'history', 注釋掉就行了（讓它默認(rèn)為 hash 模式）。
這樣一來，就可以快樂地Build項(xiàng)目啦！
到此這篇關(guān)于如何正確解決VuePress本地訪問出現(xiàn)資源報(bào)錯(cuò)404的問題的文章就介紹到這了,更多相關(guān)VuePress本地訪問404內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了Vue生命周期和數(shù)據(jù)共享，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助2022-02-02
vue?當(dāng)中組件之間共享數(shù)據(jù)的實(shí)現(xiàn)方式
這篇文章主要介紹了vue?當(dāng)中組件之間共享數(shù)據(jù)的實(shí)現(xiàn)方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-10-10
這篇文章主要為大家介紹了Vue指令實(shí)現(xiàn)大屏元素分辨率適配詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-09-09
vite build vue3項(xiàng)目配置開啟sourcemap方式
這篇文章主要介紹了vite build vue3項(xiàng)目配置開啟sourcemap方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-06-06
vue開發(fā)table數(shù)據(jù)合并實(shí)現(xiàn)詳解
這篇文章主要為大家介紹了vue開發(fā)table數(shù)據(jù)合并實(shí)現(xiàn)詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-07-07
在頁面進(jìn)行pdf預(yù)覽的時(shí)候，由于文件不能夠打印和下載很難滿足客戶的需求，接下來通過本文給大家介紹vue使用pdf.js來進(jìn)行pdf預(yù)覽,需要的朋友可以參考下2021-12-12
這篇文章主要為大家詳細(xì)介紹了如何使用Vue封裝一個(gè)前端通用右鍵菜單組件,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2024-02-02
nginx部署訪問vue-cli搭建的項(xiàng)目的方法
本篇文章主要介紹了nginx部署訪問vue-cli搭建的項(xiàng)目的方法，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-02-02
vue elementui tree 任意級(jí)別拖拽功能代碼
這篇文章主要介紹了vue elementui tree 任意級(jí)別拖拽功能代碼，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2020-08-08
使用vite創(chuàng)建vue3之vite.config.js的配置方式
這篇文章主要介紹了使用vite創(chuàng)建vue3之vite.config.js的配置方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-08-08