这里简单说一下Vue history和Vue hash history

首先前者是交给js文件进行处理

例如你的项目打包之后就只有一个index.html和一堆静态文件，index首页会通过调用js文件进行页面的渲染，当你访问/user/info时，它会自动到js中去找对应路径进行页面渲染。

而后者hash则会在地址栏中添加一个#，例如：localhost/#/user/info，当你访问这个页面的时候，其实就是在访问localhost，#后面的内容vue会自动丢掉。

简单的了解了一下之后，我们来看看解决思路：

你原本时想通过Nginx去访问，www.abc.com/user/info，但是你部署的项目里面只有一个index.html文件，所以Nginx以为在项目中没有这个路径，所有会返回404。

所以我们需要在访问我们部署的项目时候，通过Nginx去改变访问文件，将所有的请求都转发给index.html去进行处理。

首先在 vite.config.js中添加一个基础路径

export default defineConfig({
  base: '/',
  server: {
  ....

然后在Nginx的配置文件中配置一句

try_files $uri $uri/ /index.html;

这样后面再刷新页面就不会出现404的情况啦。