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，项目静态文件也能正常访问了。
（试了好久终于可以了，虽然不知道有没有其他问题）
我屮艸芔茻，啦啦啦!