Vue使用Nginx发布后刷新页面报404错误

问题现象：
使用Vue-cli构建的项目，在本地调试运行都是OK的，打包之后使用Nginx发布后，指定跳转页面是ok的，但是刷新页面，reload页面时，报错404，找不到页面。
Nginx端日志显示找不到资源路径。

解决方案：
第一种：
首先，出问题的原因是：
在 Vue 项目中，可以选择 hash或者 history.pushState() 实现路由跳转。
使用history模式的配置是：
export default new Router({
mode: ‘history’,
})
那么，当我们 npm run build 完成并部署到服务器后，刷新某个路由下的页面，会出现 404 或者 502 错误。

这是因为刷新页面时访问的资源在服务端找不到，因为vue-router设置的路径不是真实存在的路径。
所以把mode改为hash模式就可以了。

第二种：
继续使用history模式，修改Nginx的配置，使所有的请求都定向到index.html页面

location / {
		try_files $uri $uri/ @router;
		index index.html;
	}
	location @router {
		rewrite ^.*$ /index.html last;
    }

大家可以根据自己的情况使用对应的解决方案。