JS微前端MicroApp基础

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