Vue 打包部署到服务器后，非主页刷新后出现404问题解决_vue部署项目刷新后 sorry page not found

先不讨论是什么原因，直接说解决方法，分两种情况，一种是直接部署到根目录出现404，另一种是部署到二级以上目录出现404

如果是部署到根目录出现404问题，分以下情况

如果服务器是apache环境

1. 确认apache的mod_rewrite模块是否安装并开启，
2. 在根目录寻找.htaccess文件，如果不存在则创建该文件，
3. 在.htaccess文件中加入以下代码

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /index.html [L]
</IfModule>
（适用于vue项目部署在根目录情况）
1
2
3
4
5
6
7
8
9

如果服务器是nginx环境

在nginx的配置文件nginx.conf（Linux系统中该文件一般位于/etc/nginx/目录）中，找到

location / {
  #......
  #所要添加的配置代码
  try_files $uri $uri/ /index.html;
}
在上面位置添加代码（适用于vue项目部署在根目录情况）
1
2
3
4
5
6

如果是部署到二级或二级以上目录中

~~ 待测试后添加内容 ~~

出现这个404问题的原因
一种是因为vue router使用了history模式，由于history模式的链接url是伪静态，需要rewrite url规则来支持。
另一种是项目需要部署在二级或二级以上目录中，npm run build路径出现错误导致。