若依框架非根目录注销时404错误

在使用若依框架时，如果非根目录的情况下，需要进行一部分设置

1、修改项目router配置，router=>index.js：

export default new Router({
  base: '/vuejs-admin/',
  mode: 'history', // 去掉url中的#
  scrollBehavior: () => ({ y: 0 }),
  routes: constantRoutes
})

这里一是要修改router模式为history，另一个就是修改base地址为要访问的/vuejs-admin地址，注意前后都有斜线

 

2、修改build下静态资源路径前缀  我觉得这一步可以不用

 

同上一部，这里要修改assetsPublicPath为/vuejs-admin/地址

3、执行vuejs打包：npm run build

确保打包后所有静态资源均是相对地址/vuejs-admin开头，比如：

 

4、修改nginx配置，使用rewrite配置 我觉得这一步可以不用

server {
            listen       80;
            server_name  xxxx.com;

            #charset koi8-r;

            #access_log  logs/host.access.log  main;
        location /vuejs-admin-server {
                    proxy_pass http://127.0.0.1:8080/vuejs-admin-server;
            }
            location ^~/vuejs-admin {
            alias /home/server/webapps/vuejs-admin/;
            #index index.html;
            try_files $uri $uri/ @rewrites; 
        }           
         location @rewrites {
                        rewrite ^/(vuejs-admin)/(.+)$ /$1/index.html last;
                }
            error_page   500 502 503 504  /50x.html;
            location = /50x.html {
                    root   html;
            }
        }

5、热重载nginx，搞定收工：nginx -s reload

6、另外最重要的一点是，当进行了上述一系列的设置，正常访问都没问题了，但是注销时还是会出现404页面，原因就是代码中的注销操作是直接赋值的，需要修改组件layout中的Navbar.vue文件

this.$store.dispatch('LogOut').then(() => {
     location.href = '/***';//这里改成自己的子目录名
})