主要解决子应用内部跳转路由时,跳到404
页的问题
- 你能搜这个,我姑且认为你基本配置已经好了,而且
主
跳子的一级路由
是正常的,请往下看 - 忘说了,我的主应用和子应用都是Vue
主应用跳子应用都正常,为什么子应用跳子路由就会404?注意这三点
- 主应用中,你配置子应用路由的地方
{
name: 'micro app',
entry: '//localhost:8080',
container: '#microContainer',
activeRule: '/micro-app' // 记住它,姑且叫它【张三】
}
- 主应用的
router.js
(或者router.ts
)
{
path: '/micro-app/', // 跟张三一致
component: layout,
name: 'platform',
meta: {...},
children: [
{
path: ':pathMatch(.*)', // 这个表示在张三下的所有路由均有效【关键】,注意vue2和vue3配置名称不同,请自行百度
component: MicroApp, // 你需要封装一个组件,里面就放个<div id="#microContainer"></div>,用于显示子应用页面
name: 'children',
meta: {...},
}
]
}
- 最后看看你的
子应用
的router.js
(或者router.ts
)的模式中设置的路由前置
history: createWebHistory('/micro-app') //括号里一依旧是张三,注意vue2和vue3配置方法不同,请自行百度
-
好了,再试试?