nginx部署vue编译项目刷新页面404

原因：Nginx配置错误。

因为vue打包输出的是单页网页应用，只有一个index.html入口，其他路径是由前端路由去跳转的，服务器目录下没有对应物理路径，所以就会报404。

这样的Nginx配置会出现该问题。

location / {
        alias  /home/vue/dist/;
        index index.html;
}

 

解决办法：需要配置Nginx，如果找不到物理路径时，应该去哪里找。

于是将Nginx配置改为如下形式，Nginx -s reload配置，再刷新页面就不会出现该问题了。

location / {
        alias  /home/vue/dist/;
        index index.html;
        try_files  $uri $uri/ /index.html;
}