背景
最近發現好多小伙伴剛用VuePress,然后一build完就直接用本地瀏覽器訪問,結果出現黑塊。僅僅出現那種問題還好,給項目安裝 vuepress-plugin-serve 插件就行了,
但是如果有需求是需要離線查看 VuePress 生成后的文檔呢?所以我特地研究了一下——
解決辦法
打開 .vuepress/config.js 文件,把 base 的值改成 ./,為了方便調試,最好這樣寫:
1
2
|
//base: "/", base: "./" , |
寫兩個,一個用于Dev,一個用于Build。
然后打開項目下的 node_modules\@vuepress\core\lib\client 下的 app.js 文件,找到下方這個片段:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
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', 注釋掉就行了(讓它默認為 hash 模式)。
這樣一來,就可以快樂地Build項目啦!
到此這篇關于如何正確解決VuePress本地訪問出現資源報錯404的問題的文章就介紹到這了,更多相關VuePress本地訪問404內容請搜索服務器之家以前的文章或繼續瀏覽下面的相關文章希望大家以后多多支持服務器之家!
原文鏈接:https://blog.csdn.net/zpfz756/article/details/110458257