更新React Native应用后多模块报#<WeakSet> could not be cloned错误是常见问题吗

问题普遍性说明 #

这是React Native 0.72及以上版本迭代后非常常见的第三方依赖适配问题，不属于业务代码逻辑错误，你遇到的是标准场景。

报错原因 #

React Native 从0.72版本开始，将JS层与原生层通信的默认序列化方案切换为符合W3C标准的结构化克隆算法，该算法不支持序列化WeakSet、WeakMap、Symbol、函数这类无法追踪引用关系的类型，而旧版RN的自定义序列化逻辑对这类类型做了兼容处理，因此你更新RN版本后才会触发报错。

你提到的两个库都属于较早曝出该适配问题的开源组件：

• 旧版@react-native-mapbox-gl的快照管理模块内部会在向原生传递的配置参数中隐式携带WeakSet实例
• 旧版react-native-vector-icons的资源加载逻辑也存在类似的不可序列化类型透传问题

修复方案 #

临时兼容方案 #

如果暂时不打算升级相关依赖，可以直接在项目根目录的metro.config.js中关闭结构化克隆，回退到旧版序列化逻辑：

const { getDefaultConfig, mergeConfig } = require('@react-native/metro-config');

const config = {
  serializer: {
    enableStructuredClone: false,
  },
  // 其他原有配置
};

module.exports = mergeConfig(getDefaultConfig(__dirname), config);

修改完成后执行npx react-native start --reset-cache清空缓存重启服务即可生效。

永久修复方案 #

• 升级对应依赖到适配RN 0.72+的版本：@react-native-mapbox-gl/maps升级到v11.0.0及以上，react-native-vector-icons升级到v10.0.0及以上即可，这些版本均已移除了内部不可序列化类型的透传逻辑
• 若依赖已停止维护，可手动修改node_modules下对应依赖的源码，删掉传给原生接口的参数中包含的WeakSet等不可序列化内容，再通过patch-package工具生成补丁留存修改，避免后续重新安装依赖时修改丢失。

内容的提问来源于stack exchange，提问作者Crazy