目录 1. 介绍 2. 主应用 2.1 路由配置和基础页面 2.2 全局生命周期配置 2.3 主应用插件系统 3. 子应用 3.1 Webpack + Vue 子应用 3.2 Webpack + React 子应用 4. 应用路由配置说明 4.1 主应用路由 4.2 子
目录
- 1. 介绍
- 2. 主应用
- 2.1 路由配置和基础页面
- 2.2 全局生命周期配置
- 2.3 主应用插件系统
- 3. 子应用
- 3.1 Webpack + Vue 子应用
- 3.2 Webpack + React 子应用
- 4. 应用路由配置说明
- 4.1 主应用路由
- 4.2 子应用路由
1. 介绍
MicroApp 是“京东零售”团队在2021年7月正式发布的一个微前端框架，并且抛弃了 Single SPA 的实现理念，基于 CustomElement 和 ShadowDom 来实现。
MicroAPP 宣传的优势有以下几点：
应用接入便捷：主应用只需一行代码即可接入一个微应用（有点夸张哈）
零依赖：本身 MicroApp 并不依赖其他第三方库
框架兼容：本身对其他框架应用都做了适配，并且也兼容 Vite 和 Webpack 应用
其他基本功能：微前端框架都要实现的功能，比如js沙箱、样式隔离、数据通信等
但是因为 MicroApp 依赖 CustomElement 和 proxy，所以浏览器兼容性需要考虑。不过除了已逝的IE，其他浏览器基本都支持。
当然了，因为 MicroApp 发布比较晚，目前也还在 v1 的 alpha 版本，讨论组里面也经常有反馈bug，所以直接上正式项目还有待考虑。
2. 主应用
2.1 路由配置和基础页面
因为 MicroApp 没什么侵入性，所以直接创建用 Vite 创建一个模板项目即可。
npm create vite@latest main-app -- --template vue-ts