Vue使用history模式的router，在宝塔部署(nignx)后，点击刷新出现404问题

这个问题在我之前还找了挺久的，主要是当时没有学nginx不知道问题在哪里

问题介绍

vue项目使用nignx上线部署后，访问没有问题，但点击刷新后就404。

原因分析

因为在vue项目中使用了history的路由模式，换成hash模式就没有问题。
那为什么使用hash模式就没有问题呢？

解释：
hash模式在每次刷新页面时是直接更改“#”后的路径，history模式每次刷新会重新向服务器重新请求资源，但是服务器会把vue的路由地址当成文件路径访问（如: /pages/index），服务器又没有这个文件路径，且服务端没有配置相应的路由重定向，就会访问404。
比如：
www.baidu.com/one/two，这个页面刷新时，history模式下会请求服务器的/one/two这个文件，但服务器哪里来的这个文件呢，vue又是单页面应用，所有的页面都是index.html，因此就404了。

解决办法

既然有问题那就肯定有办法，分两种：

1. 使用hash模式的路由

const router = new Router({
    mode: 'hash'
});

2. 2. Nginx配置伪静态(配置所有找不到的请求都返回index.html)
      Nginx的配置文件加入伪静态：

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

宝塔中配置：