vue-router history模式 為什么需要服務端配置以及如何配置

vue-router 的 history模式，是為了地址欄看起來更加自然。但是需要在服務端進行一些額外的配置。

為什么需要額外配置？

假設應用地址為abc.com，服務端不加額外的配置。當通過abc.com來訪問時，是沒有問題的，可以正常加載到html文件，之后通過route-link或者router.api來跳轉也不會有問題，因為之后都不會刷新頁面請求html，只是通過history.pushState或者history.replaceState來改變history記錄，修改地址欄地址而已；

但是如果是直接訪問子路由abc.com/test時就會有問題，/test是子路由名，但是服務器中並不存在該目錄，就無法索引到html文件，此種情況下就會出現404，所以不管是訪問什么路徑，都應該加載根目錄的html文件，因為/xxx/yyy對我們應用來講是子路由路徑而已。

配置

官方提供了多種配置方案，而在項目中我用到的是nginx配置，主要用的是try_files,其作用可以理解為是按照配置的順序去找文件，並按找到的第一個去請求文件

        location / {
            # ...其他配置
            # /xxx/yyy/找不到，就去找 /index.html 
            try_files $uri $uri/ /index.html =404;
        }

加了上面的路徑之后，不管通過何種子路由來直接訪問，都能順利拿到html