@[toc]
微前端概念
概念
微前端是一种多个团队通过独立发布功能的方式来共同构建现代化 web 应用的技术手段及方法策略
微前端的核心价值
- 技术栈无关 主框架不限制接入应用的技术栈,微应用具备完全自主权
- 独立开发、独立部署 微应用仓库独立,前后端可独立开发,部署完成后主框架自动完成同步更新
- 增量升级 在面对各种复杂场景时,我们通常很难对一个已经存在的系统做全量的技术栈升级或重构,而微前端是一种非常好的实施渐进式重构的手段和策略
- 独立运行 每个微应用之间状态隔离,运行时状态不共享
微前端的实现演变
- iFrame
- Qiankun
- Webpack 5 的 Module Federation
相关框架 Qiankun
Qiankun 是基于 single-spa 的微前端实现库,由阿里开发
优势是技术解耦、样式隔离、JS 沙箱、资源预加载、提供了 UMI 插件、兼容 IE11
相关框架 Webpack 5 的 Module Federation
优点是基于 Webpack , 前端比较熟悉,上手快
缺点是需要所有的项目都基于 Webpack ,且已经升级到 Webpack 5 ,局限性较大
Webpack5 跨应用代码共享 - Module Federation
相关框架 Piral
优点是高度模块化、多框架兼容、支持资源文件拆分、全局状态管理、独立开发部署、CLI 工具
缺点是文档太少,且资料都是英文的