IOS App Stuck on white screen after splash screen-CodePudding

Hi So i recently deployed an app on the app store. It was launching just fine locally in Expo go without any errors but when I download it from the app store it opens up shows the splash screen for like a sec and then has a blank white screen and stays there. Any ideas what could be wrong. It's my first app so I'm not sure where to even start. Its a react native expo project.

Expo SDK 46.0.10

below is my package.json

{
  "dependencies": {
    "@babel/runtime": "^7.18.9",
    "@expo-google-fonts/inter": "^0.2.2",
    "@expo-google-fonts/nunito-sans": "^0.2.2",
    "@expo/config-plugins": "^5.0.1",
    "@fawazahmed/react-native-read-more": "^2.3.6",
    "@gorhom/bottom-sheet": "^4.2.2",
    "@react-native-async-storage/async-storage": "~1.17.3",
    "@react-native-community/checkbox": "^0.5.12",
    "@react-native-community/datetimepicker": "6.2.0",
    "@react-native-community/masked-view": "^0.1.11",
    "@react-navigation/bottom-tabs": "^6.2.0",
    "@react-navigation/material-top-tabs": "^6.2.1",
    "@react-navigation/native": "^6.0.8",
    "@react-navigation/native-stack": "^6.6.1",
    "@react-navigation/stack": "^6.1.1",
    "@reduxjs/toolkit": "^1.8.5",
    "axios": "^0.27.2",
    "chalk": "^5.0.1",
    "deprecated-react-native-prop-types": "^2.2.0",
    "email-validator": "^2.0.4",
    "expo": "^46.0.10",
    "expo-app-loading": "~2.1.0",
    "expo-auth-session": "~3.7.1",
    "expo-av": "~12.0.4",
    "expo-calendar": "~10.3.0",
    "expo-camera": "~12.3.0",
    "expo-dev-client": "~1.2.1",
    "expo-firebase-analytics": "~7.1.1",
    "expo-font": "~10.2.0",
    "expo-image-picker": "~13.3.1",
    "expo-linear-gradient": "~11.4.0",
    "expo-media-library": "~14.2.0",
    "expo-permissions": "^13.2.0",
    "expo-random": "~12.3.0",
    "expo-splash-screen": "~0.16.2",
    "expo-status-bar": "~1.4.0",
    "expo-updates": "~0.14.5",
    "expo-video-thumbnails": "~6.4.0",
    "firebase": "^9.9.3",
    "formik": "^2.2.9",
    "moment": "^2.29.1",
    "nanoid": "^4.0.0",
    "react": "18.0.0",
    "react-country-region-selector": "^3.6.1",
    "react-dom": "18.0.0",
    "react-native": "0.69.5",
    "react-native-action-button": "^2.8.5",
    "react-native-axios": "^0.17.1",
    "react-native-bouncy-checkbox": "^2.1.10",
    "react-native-bouncy-checkbox-group": "^0.1.0",
    "react-native-country-codes-picker": "^1.4.2",
    "react-native-country-picker-modal": "^2.0.0",
    "react-native-date-picker": "^4.2.5",
    "react-native-elements": "^3.4.2",
    "react-native-gesture-handler": "~2.5.0",
    "react-native-get-random-values": "^1.8.0",
    "react-native-gifted-chat": "^0.16.3",
    "react-native-google-places-autocomplete": "^2.4.1",
    "react-native-image-crop-picker": "^0.37.3",
    "react-native-image-viewing": "^0.2.2",
    "react-native-keyboard-aware-scroll-view": "^0.9.5",
    "react-native-keyboard-manager": "^6.5.4-4",
    "react-native-maps": "0.31.1",
    "react-native-material-dropdown": "^0.11.1",
    "react-native-multi-selectbox": "^1.5.0",
    "react-native-onboarding-swiper": "^1.2.0",
    "react-native-pager-view": "5.4.24",
    "react-native-phone-number-input": "^2.1.0",
    "react-native-reanimated": "~2.9.1",
    "react-native-select-dropdown": "^1.11.0",
    "react-native-shimmer-placeholder": "^2.0.8",
    "react-native-skeleton-placeholder": "^5.0.0",
    "react-native-svg": "12.3.0",
    "react-native-tab-view": "^3.1.1",
    "react-native-vector-icons": "^9.1.0",
    "react-native-web": "~0.18.7",
    "react-query": "^3.39.0",
    "react-redux": "^8.0.1",
    "reanimated-bottom-sheet": "^1.0.0-alpha.22",
    "redux": "^4.2.0",
    "redux-persist": "^6.0.0",
    "redux-persist-expo-filesystem": "^2.0.0",
    "redux-thunk": "^2.4.1",
    "styled-components": "^5.3.5",
    "throttle-debounce": "^5.0.0",
    "uuid-random": "^1.3.2",
    "valid-url": "^1.0.9",
    "yup": "^0.32.11"
  },
  "devDependencies": {
    "@babel/core": "^7.12.9"
  },
  "scripts": {
    "start": "expo start --dev-client",
    "android": "expo run:android",
    "ios": "expo run:ios",
    "web": "expo start --web"
  },
}

import React from 'react';
import { Provider } from 'react-redux';
import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import rootReducer from './redux/reducers';
import Routes from './navigation/Routes';
import { QueryClientProvider, QueryClient } from 'react-query';
import { LogBox } from 'react-native';
let store = createStore(rootReducer, applyMiddleware(thunk)); 

export default function App() {
  LogBox.ignoreLogs(['Setting a timer']);
  LogBox.ignoreLogs(['EventEmitter.removeListener'])
  const queryClient = new QueryClient({
    defaultOptions: { queries: { refetchInterval: false, staleTime: Infinity } }
  });

  return ( 

    <Provider store={store}>
      <QueryClientProvider client={queryClient}>
        <Routes />
      </QueryClientProvider>
    </Provider>

  )

}

the the routes component

import React, { useEffect } from 'react';
import { SignedInStack } from './navigation';
import { SignedOutStack } from './navigation';
import { NavigationContainer } from '@react-navigation/native';
import { useDispatch, useSelector } from 'react-redux';
import { userAuthStateListener, } from '../redux/actions/auth';

import AppLoadingScreen from '../screens/AppLoadingScreen';

const Routes = () => {
    
    const user = useSelector(state => state.auth)
    const dispatch = useDispatch(); //get the dispatch from the redux state

    useEffect(() => {
    
            dispatch(userAuthStateListener());

    }, [])

    if (!user.loaded) {
        return <AppLoadingScreen />
    }

    return (
        <NavigationContainer>
            {
                user.currentUser !== null ?
                    <SignedInStack />
                    :
                    <SignedOutStack />
            }

        </NavigationContainer>
    );

}

export default Routes

CodePudding user response：

(This should be a comment but my rating is still low).

It's hard to tell without some crash logs but it looks like a bootstrapping error. some potential culprits that come to mind:

your conditional for hiding the splash screen is incomplete and some operation hasn't finished executing (check any async operations like loading fonts)
if you have any other bootstrapping logic between rendering the app and the first screen, go through that as well.

My suggestion would be to include your App.tsx code or, ideally, some crash logs.

CodePudding user response：

After Hours of debugging and starting with a fresh project I realized I had not installed react native screens. Oddly enough there was no error showing up in the expo crash logs and it was running perfectly. On both ios and android from expo go. Had to set up sentry in the project, unfortunately Testflight also didn't bring up any entries. But thanks to sentry I was finnaly able to see the error requireNativeComponent: "RNSScreen" was not found in the UIManager.