vue 在nginx下頁面刷新出現404問題解決和在nginx下頁面加載了js可是頁面顯示空白問題解決

1、vue 在nginx下頁面刷新出現404

  在網上翻遍了全部這樣問題的解決辦法，全都是一個解決辦法也是正確的解決辦法，（後來在vue官網上關於history方式出現404解決方法也是這樣說的），只是沒有表達完整，可能會讓比較急於解決這個問題的人簡單複製卻始終解決不了問題

nginx正確的配置：

一、若是是在根目錄則配置以下

location / {
　　root  /；
　　index index.html;
　　try_files $uri $uri/ /index.html
}

2.若是是有特定目錄

location /xx/xx/ {
　　root  /；
　　index index.html;
　　try_files $uri $uri/ /xx/xx/index.html
}

附上官方vue-router的說明：https://router.vuejs.org/zh-cn/essentials/history-mode.html

 

2、vue打包後發佈在nginx下，頁面加載了js可是頁面顯示空白

這個問題是由於在配置router的時候沒有帶上本身的項目的目錄，在配置router那裏加上項目路徑就能夠了

1.直接寫在router上

若是直接是根目錄就將/xx/xxx改爲/

 export default new Router({

  mode: 'history',
  base: '/xx/xxx',
  routes: [
    {
      path: '/',
      name: 'Login',
      component: signIn
    }
  ]
})

2.寫成全局變量在配置文件裏，以便發佈

export default new Router({

  mode: 'history',
  base:env.base_build_path,

 routes: [
 {
 path: '/',
 name: 'Login',
 component: signIn
 }
 ]
})

注：這個env.base_build_path就是配置文件裏的一個全局變量，也是項目路徑（只做爲本身的記錄，有須要的人作爲參考）