vue-router+nginx 非根路徑配置方法

vue-router 的默認數據hash模式-使用url的hash來模擬一個完整的URL，因而當URL改變時，頁面不會從新加載。

通常狀況下，咱們不喜歡醜醜的hash，相似於index.html#/matchResult，能夠使用路由的history模式。history模式是利用history.pushState API來實現頁面跳轉。

可是有個問題，在使用nginx的時候，咱們須要添加一些配置。

直接配置在根路徑下

直接配置在根路徑下，訪問的時候只用輸入http://yoursite.com，在nginx的配置以下

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

非根路徑配置

若是一個域名下有多個項目，那麼使用根路徑配置就不合適了，咱們須要在根路徑下指定一層路徑，好比說

A項目

http://yoursite.com/A

B項目

http://yoursite.com/B

nginx的配置

location ^~/A {
            alias /XX/A;//此處爲A的路徑
            index index.html;
            try_files $uri $uri/ /A/index.html;
    }
    location ^~/B {
            alias /XX/B;//此處爲B的路徑
            index index.html;
            try_files $uri $uri/ /B/index.html;
    }

tip: 注意要用alias不能用root