Vue打包部署Nginx后页面路径刷新404的问题

404的原因

浏览器访问的路径URL在Vue打包的项目资源路径中是不存在的，因为Vue的路由存在于vue-router的js中，并不是真实的URL

解决方式

Nginx中添加以下代码

server {
    listen 80;
    server_name localhost;
    ...

    #vue-router配置
    location / {
        try_files $uri $uri/ @router;
        index index.html;
    }
    location @router {
        rewrite ^.*$ /index.html last;
    }
}

谨记 修改配置后请重载Nginx

nginx -s reload