说明

在上一篇我们把 vue 应用的根目录解决之后，有一个子应用希望部署到 tomcat 的子目录。

我想这还不简单。

但是实际发现，页面打开空白，console 没有报错。

排查

经历了 vue 的 tomcat ROOT 部署，我再次确认了 vue.config.js

  [plaintext]
1
publicPath: './',

这里已经改成 ./ 了。

问题原因

查了一堆资料，发现需要调整一下 VueRouter 中的配置信息。

  [js]
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
const router = new VueRouter({
  mode: 'history',
  base: process.env.NODE_ENV === 'production' ? '/what-happened-h5/' : '/',
  routes: [{
    path: '/',
    name: 'mainPage',
    component: MainPage,
    children: pages,
    meta: {
      requiresAuth: true // 访问该路由时需要判断是否登录
    }
  },
  {
    path: '/login',
    name: 'login',
    component: Login,
    meta: {
      requiresAuth: false // 访问该路由时需要判断是否登录
    }
  }
  ]
});