React Native Expo生产版本运行卡在SplashScreen无报错问题求助

核心问题排查方向 #

• 原生启动屏未主动隐藏
  开发模式下Expo会自动隐藏原生层的启动屏，但生产构建需要主动调用隐藏API，你自定义的JS层ZplashScreen会被未隐藏的原生启动屏覆盖，看起来就像卡在启动界面。
  解决步骤：
  1. 安装依赖：expo install expo-splash-screen
  2. 在App.js顶部导入：import * as SplashScreen from 'expo-splash-screen'
  3. 在loading状态切换为false的逻辑前调用隐藏方法：

  // 已登录分支修改
  .then((document) => {
    const userData = document.data()
    setUser(userData)
    SplashScreen.hideAsync() // 新增这行
    setLoading(false)
  })
  // 未登录分支也添加
  } else {
    setUser(null)
    SplashScreen.hideAsync() // 新增这行
    setLoading(false)
  }
  

• Firebase生产环境配置/规则问题
  生产环境下如果出现以下情况，会导致Firebase查询卡住，永远走不到setLoading(false)的逻辑：
  1. Firebase控制台未添加生产包对应的Android SHA1、iOS Bundle ID白名单
  2. Firestore安全规则限制了未认证用户的查询权限
     排查方法：临时将Firestore安全规则设置为公开测试，确认是否能正常进入应用，再逐步调整规则、核对Firebase控制台的应用配置。
• 导航组件多余节点报错
  你在Stack.Navigator、Tab.Navigator内部包裹了多余的<>空标签，React Navigation生产构建对这类冗余节点的处理存在兼容性问题，会导致导航渲染失败。
  解决方法：删除所有导航容器内部的空标签，直接挂载Stack.Screen/Tab.Screen即可，示例如下：

  // 修改前的HomeNavigation
  const HomeNavigation = () => {
    return (
      <Stack.Navigator>
        <>
        <Stack.Screen name="Home">
              {props => <HomeScreen {...props} userData={user} />}
        </Stack.Screen>
        </>
      </Stack.Navigator>
    );
  }
  // 修改后的HomeNavigation
  const HomeNavigation = () => {
    return (
      <Stack.Navigator>
        <Stack.Screen name="Home">
              {props => <HomeScreen {...props} userData={user} />}
        </Stack.Screen>
      </Stack.Navigator>
    );
  }
  

  其余导航容器（SettingsNavigation、未登录状态的Stack.Navigator）都按相同规则修改。
• 生产压缩导致的polyfill兼容问题
  你用到的base-64 polyfill在生产压缩后可能存在全局变量挂载失败的问题，会引发后续依赖btoa/atob的逻辑静默报错卡住。
  排查方法：先注释掉base-64导入和全局变量挂载的代码，测试生产构建是否正常，若正常可以升级base-64到最新版本，或者替换为React Native官方推荐的Base64处理方案。
• 加弹窗定位卡住节点
  生产环境默认关闭日志输出，可以在Firebase回调、loading状态变更的各个分支添加alert弹窗，确认代码执行到了哪一步，快速定位卡住的具体逻辑。

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