vue history模式下 刷新或路由跳轉404

vue-router 默認 hash 模式 —— 使用 URL 的 hash 來模擬一個完整的 URL，於是當 URL 改變時，頁面不會重新加載。並且url上會出現我們討厭的‘#’。

如果不想要很丑的 hash，我們可以用路由的 history 模式，這種模式充分利用 history.pushState API 來完成 URL 跳轉而無須重新加載頁面。

const router = new VueRouter({
　base: '你的項目名',
  mode: 'history',
  routes: [...]
})

這里附上vue router 關於history模式的官方文檔： https://router.vuejs.org/zh/guide/essentials/history-mode.html


解決方法：
因為nginx配置為一個端口下配置多個項目：

server {
	listen       8801;
	server_xxx;
	root 存放打包后項目的根目錄;
	
	location /你的項目名/ {
		root 存放打包后項目的根目錄;
		index  index.html index.htm;
		try_files $uri $uri/ /你的項目名/index.html;
	}
}

　　

這種情況下vue項目的static靜態文件路徑還出現404問題，這時候我們在config/index中build

    index: path.resolve(__dirname, '../dist/index.html'),
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',
    assetsPublicPath: '/你的項目名/',

 

再試試之前出現的問題，直接進入某個路由不會出現404，刷新路由不會出現404，項目靜態文件也能正常訪問了。
（試了好久終於可以了，雖然不知道有沒有其他問題）
我屮艸芔茻，啦啦啦!