Vue部署服务器，刷新页面 404/502 报错

〆千寻、

发布于 2020-03-11 18:54:39

2.2K0

发布于 2020-03-11 18:54:39

在vue项目中，部署项目到服务器的时候报404/502的错误一般可以用hash()和history.pushState() 作为路由跳转，就下面这样滴如果用下面的这个去 run build 就会报404的错误或者502

export default new Router({
  mode: 'history',
  base: __dirname,
  scrollBehavior,
  routes: [index, blog, project, about, list]
})

刷新页面时就会报错找不到，因为路径不是真实存在的路径 解决方案：修改一下nginx配置

server {
        listen 80;
        server_name www.fayinme.cn;

        gzip on;
        gzip_min_length 1k;
        gzip_buffers 4 16k;
        gzip_comp_level 2;
        gzip_vary off;
        gzip_disabled "MSIE [1-6]";
        autoindex on;

        root /www/blogfront/production/current;
        index index.html;
        
        location / {
                try_files $uri $uri/ @router;
                index index.html;
        }

        location @router {
                rewrite ^.*$ /index.html last;
        }

本文参与腾讯云自媒体分享计划，分享自作者个人站点/博客。

原始发表：2019年10月29日，如有侵权请联系 cloudcommunity@tencent.com 删除

nginx