1.前言

? ? ? ? 微前端，將一個大的前端應用拆分為多個小型的，獨立開發的前端應用，每一個小型的應用都可以單獨的開發，部署和運行。這種結構允許不同的團隊使用不同的技術棧來開發應用的不同部分，提高開發的效率與靈活性。

2.實現微前端

利用現有的微前端框架來進行實現

2.1螞蟻金服-微前端乾坤(qiankun)
乾坤繼承single-spa:

• 微應用獨立部署
• 延遲加載
• 技術無關

乾坤提供:

• HTML入口訪問模式
• 樣式隔離
• JS沙箱
• Umi插件繼承?

具體使用，參考乾坤官方項目文檔使用?

GitHub - umijs/qiankun: 📦 🚀 Blazing fast, simple and complete solution for micro frontends.

2.2 騰訊開源基于webComponents和iframe-微前端無界（wujie）

????????無界微前端是一款基于 Web Components + iframe 微前端框架，具備成本低、速度快、原生隔離、功能強等一系列優點。

????????Web Components 是一個瀏覽器原生支持的組件封裝技術，可以有效隔離元素之間的樣式，iframe 可以給子應用提供一個原生隔離的運行環境，相比自行構造的沙箱 iframe 提供了獨立的 window、document、history、location，可以更好的和外部解耦

原生隔離?

• ????????css 樣式通過 Web Components 可以做到嚴格的原生隔離
• ????????js 運行在 iframe 中做到嚴格的原生隔離

功能強大

• ????????支持子應用嵌套
• ????????支持多應用激活
• ????????支持應用共享
• ????????支持生命周期鉤子
• ????????支持插件系統
• ????????支持 vite 框架.....等

具體使用參考官網項目文檔使用

https://github.com/Tencent/wujie

3.參考

? ? ? ? 僅做學習記錄，博客參考

https://juejin.cn/post/7304946949940674587?searchId=20250320100915C3170A62AD017E14E75Dhttps://juejin.cn/post/7304946949940674587?searchId=20250320100915C3170A62AD017E14E75D

微前端框架之乾坤【qiankun】 vue3+vite+qiankun（手把手搭建版）_乾坤框架-CSDN博客文章瀏覽閱讀1.1w次，點贊58次，收藏53次。簡介:qiankun是一種微前端框架，可以將多個前端應用集成為一個整體。每個子應用可以使用不同的框架和技術棧，它們之間可以相互獨立開發和部署,qiankun提供了一套完整的生命周期函數和通信機制，可以讓不同的子應用之間進行跨框架和跨域的通信和交互。_乾坤框架https://blog.csdn.net/m0_51400948/article/details/140438945?fromshare=blogdetail&sharetype=blogdetail&sharerId=140438945&sharerefer=PC&sharesource=2301_76671906&sharefrom=from_link