single-spa 子应用路由跳转报错

问题描述

single-spa 和 qiankun 中，基座应用使用 router 切换子应用均会出现问题

子应用中路由变更后切换子应用会出现报错的问题，初步怀疑是主应用和子应用 vue 和 vue-router 版本不同导致的

报错信息

解决方法

Vue3 基座（慎用）

基座应用为 VUe3，子应用为 Vue2

// layout/src/router/index.ts
router.beforeEach((to, from, next) => {
  if (_.isEmpty(history.state.current)) {
    _.assign(history.state, { current: from.fullPath });
  }
  next();
});

此时，页面可以正常跳转

此时会出现页面跳转历史丢失的问题

修改切换子应用跳转方式

不要使用基座应用中的路由跳转，这里参考微应用之间如何跳转，使用 pushState 进行跳转

window.history.pushState({}, '', `/${appPath}`);