微前端（Micro-Frontends）是一种多个团队通过独立发布功能的方式来共同构建现代化 web 应用的技术手段及方法策略。它旨在解决单体应用在一个相对长的时间跨度下，由于参与的人员、团队的增多、变迁，从一个普通应用演变成一个巨石应用（Frontend Monolith）后，随之而来的应用不可维护的问题。这类问题在企业级 Web 应用中尤其常见。

微前端架构旨在将巨石应用拆分成多个可以独立开发、独立运行、独立部署的小应用，从而达到多个小应用共同构建一个大型应用的目的。

• 技术栈无关，微前端架构允许我们在不同的应用中使用不同的技术栈，例如：React、Vue、Angular、JQuery 等等。
• 独立开发、独立部署，微前端架构允许我们将一个庞大的应用拆分成多个小应用，这些小应用可以独立开发、独立部署，各个小应用之间又可以共用代码。
• 独立运行时，微前端架构允许我们将多个小应用独立运行在一个框架中，也可以将多个小应用运行在不同的框架中。
• 增量升级，微前端架构允许我们将不同技术栈的应用进行重构，从而达到技术栈升级的目的。
• 独立团队，微前端架构允许我们根据不同的业务模块组建不同的团队，从而实现真正的前后端分离。

微应用（qiankun）之 vite 构建

基于 vite 构建微应用（qiankun），各应用涉及技术栈如下：

• 主应用(micro-main)：react18 + react-router6 + redux8 + qiankun2 + vite2
• 子应用(react-app)：react18 + react-router6 + qiankun2 + vite2
• 子应用(vue-app)：vue3 + vue-router4 + qiankun2 + vite2

主应用(micro-main)

cd micro-main && pnpm install && pnpm run dev

子应用(react-app)

cd react-app && pnpm install && pnpm run dev

子应用(vue-app)

cd vue-app && pnpm install && pnpm run dev