基座与子应用代码示例

本示例中，基座为Vue3，子应用也是Vue3，由于qiankun不支持Vite构建的项目，这里还要引入

vite-plugin-qiankun 插件

基座（主应用）

加载qiankun依赖 

 npm i qiankun -S

qiankun配置（src/qiankun）

src/qiankun/config.ts

export default {subApps: [{name: 'sub-app', // 子应用名称，跟package.json一致entry: 'http://localhost:3001/sub-app/', // 子应用入口，本地环境下指定端口container: '#sub-container', // 挂载子应用的domactiveRule: '/sub-app', // 路由匹配规则props: {} // 主应用与子应用通信传值},]
}

 src/qiankun/index.ts

import { registerMicroApps, start } from 'qiankun'
import config from './config'const { subApps } = config// 注册子应用
export function registerApps() {try {registerMicroApps(subApps, {beforeLoad: [async app => {console.log('before load', app)}],beforeMount: [async app => {console.log('before mount', app)}],afterUnmount: [async app => {console.log('b