Expo热刷新偶现ExpoRoot Element type invalid报错求助

应用首页运行时首先抛出如下警告：

Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: object. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check the render method of `ExpoRoot`.
    in ExpoRoot
    in RCTView (created by View)
    in View (created by AppContainer)
    in RCTView (created by View)
    in View (created by AppContainer)
    in AppContainer

警告出现后会触发致命错误：

Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check the render method of `ExpoRoot`.

This error is located at:
    in ExpoRoot
    in RCTView (created by View)
    in View (created by AppContainer)
    in RCTView (created by View)
    in View (created by AppContainer)
    in AppContainer

复现规律 #

• 报错非稳定复现，仅在开发阶段热刷新代码变更时偶发，触发概率约为每10-20次热刷新出现1次
• 已全面排查所有组件的导入/导出配置，将业务代码全部注释简化为最简示例后问题仍然存在，可以排除业务代码中组件导入导出错误的可能
  使用的最简测试代码如下：

import React from 'react';
import { View, Text } from 'react-native';


export default function App() {
  return(
    <View>
      <Text>test</Text>
    </View>
  );
}

这是React Native/Expo开发环境下Fast Refresh（热刷新）的已知模块缓存bug：触发热更新时Metro打包器的模块缓存未正确同步，ExpoRoot读取到的入口App模块是被包装后的普通对象，而非默认导出的组件函数。该问题仅存在于开发环境，生产环境正式打包不会触发。

按优先级选择以下方案即可：

• 临时恢复：触发报错后手动执行全量重载，在运行expo服务的终端连续按两次R键，或者执行npx expo start -c清除缓存重启开发服务即可恢复
• 版本升级：将expo、react-native、metro相关依赖升级到对应大版本的最新稳定补丁版，新版本已经修复了绝大多数热更新缓存不一致的问题
• 配置调整：如果升级版本后仍有问题，可以在项目根目录的metro.config.js中调整开发环境缓存配置，关闭增量模块缓存：

const { getDefaultConfig } = require('expo/metro-config');
const config = getDefaultConfig(__dirname);

// 开发环境清空缓存存储配置，避免热刷新读取到错误的模块对象
if (process.env.NODE_ENV === 'development') {
  config.cacheStores = [];
}

module.exports = config;

• 插件排查：如果项目配置了自定义babel插件或者模块别名规则，检查插件是否会在热更新时重复包装默认导出模块，移除不必要的模块转换类插件可大幅降低报错触发概率。

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