微前端最近已經很火了，最近跟著火的還有 webpack5 module federation 了，想必大家都有耳聞了。但是我今天主要講的是微模組，我覺得它更值得被推崇。
微模組的優勢如下：
- 模組化按需編譯
- 模組化部署釋出
- 跨專案共享微模組(支援配置 host 和 version)
先解釋下 微前端 和 微模組，?請看下圖所示。
微前端架構：
微模組架構：
微模組實際上是一種專案檔案組織規範，並不是什麼新技術，如下圖所示：
不知道大家發現沒有，其實編譯效能慢的罪魁禍首就是：npm run serve 和 npm run build。以前我們總覺得極致的去優化webpack配置達到解決編譯慢的問題。其實我們可以考慮去做微模組。因為我們只有清楚的分清哪些是我們該編譯，哪些不該編譯的，才能真正找到效能編譯慢的源頭。
模組化按需編譯
模組化開發部署
實際上釋出部署的是一個umd的包。
跨專案共享微模組 (支援配置 host 和 version)
最後我想說說 webpack5 module federation 模組聯邦，我覺得它的場景可能更多是解決跨應用之間的共享模組，其實沒有微模組靈活。我覺得應該會很少去跨應用共享某個單獨的元件。然後在嘗試了module federation 發現它沒法去做 dynamic import（大家可以試試，如下圖），我陷入了沉思～
如果覺得有點用，歡迎點贊、評論，謝謝?