MFE: 讨论用Module Federation解决版本不匹配的报错

Module Federation版本冲突解决方案

原创

已于 2025-12-08 14:21:41 修改 · 599 阅读

14 ·

CC 4.0 BY-SA版权

文章标签：

#微服务 #前端 #学习

于 2025-12-08 09:30:00 首次发布

背景

一个React项目使用了两个及以上的Angular MFE，其中一个MFE的Angular版本是18，另外一个是20，然后当成功加载完第一个A18 MFE之后，再去加载A20 MFE（或者调转顺序来加载这两个Angular MFE），都会出现类似下面的报错，而且发现不仅是React, 当host是Angular, remote也是Angular，但是两个Angular的版本不一致, 也会出现类似下面的报错：

Note: 这篇博客的前提是不使用web component, iframework的的方式加载MFE，而且使用的Module Federation, 不是什么 qiankun, single-spa等其他的MFE工具

解决修复尝试

经过查阅资料，得到下面的信息，虽然singleton正常来讲要是true而且把它修改成false的风险极大，但是为了修复这个issue我们还是尝试了下面改成false的情况，所以下面也总结了尝试修改webpack.config.js中的singleton 和 strictVersion这两个属性的值来修复这个问题的测试结果，测试过下面包括但不限于下面的方法，但是都是没有成功过：

查阅的信息如下：

测试结果如下：

A: Host Angular, B: Remote Angular

A 20.3.7, B 18.2.0:  没有系统正常工作的任何可能

A 20.3.7, B 20.3.12: 正常来讲只要strictVersion设置为false就能正常的工作，但是如果非要改singleton这个属性，那么就只能改remote的singleton成false。