React Native Expo App安卓端默认导出缺失错误排查求助

以下是针对你遇到的问题的具体排查和解决步骤：

1. 严格校验组件默认导出语法 #

• 确保所有路由组件使用无条件的默认导出，避免命名导出或条件导出：
  ✅ 正确写法：

  const EditGroup = () => { /* 组件代码 */ };
  export default EditGroup;
  

  或

  export default function EditGroup() { /* 组件代码 */ }
  

  ❌ 错误写法：

  export const EditGroup = () => { /* 组件代码 */ }; // 命名导出不符合App Router要求
  

  if (Platform.OS === 'web') {
    export default EditGroup; // 条件导出会导致安卓端无导出
  }
  

• 检查tsconfig.json配置，确保编译规则不会破坏导出：

  {
    "compilerOptions": {
      "moduleResolution": "bundler",
      "target": "ESNext",
      "jsx": "react-jsx",
      "esModuleInterop": true
    }
  }
  

2. 彻底清除缓存（核心步骤） #

• 终止所有相关进程：
  • Mac/Linux：执行 killall -9 node
  • Windows：打开任务管理器，结束所有node.exe进程
• 清除Metro缓存并重启开发服务：

  npx expo start --clear
  

• 安卓端缓存清理：
  • Expo Go：长按你的App图标，选择「Clear Cache」后重新打开
  • 已安装APK：完全卸载后重新安装，避免残留旧缓存

3. 检查路由结构与文件一致性 #

• 确认App Router的目录结构完全正确：(app)/edit-group/[id].tsx需直接位于(app)目录下，无嵌套错误
• 检查文件名大小写：安卓文件系统虽不敏感，但Metro打包时严格匹配路径，确保[id].tsx的拼写（包括大小写）与路由引用完全一致
• 排查组件内的错误导入：检查所有import语句，确保没有引用不存在的文件或未安装的依赖——这类错误常导致Metro抛出「unknown module undefined」的模糊提示

4. 校验依赖兼容性与配置 #

• 运行Expo诊断工具修复版本不兼容问题：

  npx expo doctor
  

  按照提示更新或修复所有依赖包，确保expo、expo-router、react-native版本完全匹配
• 检查第三方库的安卓兼容性：避免使用仅支持Web的库，若使用如react-native-reanimated等需要原生配置的库，确保babel.config.js包含正确插件且置于末尾：

  module.exports = function(api) {
    api.cache(true);
    return {
      presets: ['babel-preset-expo'],
      plugins: ['react-native-reanimated/plugin'] // 必须放在最后
    };
  };
  

5. 排查动态导入问题 #

• 若使用expo-router的dynamic或React的import()动态导入，确保目标文件存在且有默认导出，且路径正确：
  ✅ 正确写法：

  import { dynamic } from 'expo-router';
  const EditGroup = dynamic(() => import('./edit-group/[id]'));
  

  ❌ 错误写法：

  const EditGroup = dynamic(() => import('./edit-group/ID')); // 路径拼写错误
  

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