背景

最近發現好多小夥伴剛用VuePress，然後一build完就直接用本地瀏覽器訪問，結果出現黑塊。僅僅出現那種問題還好，給專案安裝 vuepress-plugin-serve 外掛就行了，
但是如果有需求是需要離線檢視 VuePress 生成後的文件呢？所以我特地研究了一下——

解決辦法

開啟 .vuepress/config.js 檔案，把 base 的值改成 ./，為了方便除錯，最好這樣寫：

//base: "/",base: "./",

寫兩個，一個用於Dev，一個用於Build。

然後開啟專案下的 node_modules\@vuepress\core\lib\client 下的 app.js 檔案，找到下方這個片段：

 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內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們！