title: react native expo blank white screen after splash screen
body: <p><a href="https://i.stack.imgur.com/RjAAm.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/RjAAm.jpg" alt="after splash screen, I'm getting this white blank white screen, it's not routing to either Login component or DashBoard component" /></a>&gt; app.json</p>
  <pre><code>{
    &quot;expo&quot;: {
      &quot;name&quot;: &quot;Csearch&quot;,
      &quot;slug&quot;: &quot;Csearch&quot;,
      &quot;version&quot;: &quot;1.0.0&quot;,
      &quot;orientation&quot;: &quot;portrait&quot;,
      &quot;sdkVersion&quot;: &quot;38.0.0&quot;,
      &quot;icon&quot;: &quot;./assets/icon.png&quot;,
      &quot;splash&quot;: {
        &quot;image&quot;: &quot;./assets/splash.png&quot;,
        &quot;resizeMode&quot;: &quot;contain&quot;,
        &quot;backgroundColor&quot;: &quot;#2e64ae&quot;
      },
      &quot;updates&quot;: {
        &quot;fallbackToCacheTimeout&quot;: 0
      },
      &quot;assetBundlePatterns&quot;: [&quot;**/*&quot;],
      &quot;android&quot;: {
        &quot;package&quot;: &quot;com.geekonomy.Csearch&quot;,
        &quot;versionCode&quot;: 1
      },
      &quot;ios&quot;: {
        &quot;supportsTablet&quot;: true
      },
      &quot;web&quot;: {
        &quot;favicon&quot;: &quot;./assets/favicon.png&quot;
      }
    }
  }
  </code></pre>
  <blockquote>
  <p>package.json</p>
  </blockquote>
  <pre><code>{
    &quot;main&quot;: &quot;node_modules/expo/AppEntry.js&quot;,
    &quot;scripts&quot;: {
      &quot;start&quot;: &quot;expo start&quot;,
      &quot;android&quot;: &quot;expo start --android&quot;,
      &quot;ios&quot;: &quot;expo start --ios&quot;,
      &quot;web&quot;: &quot;expo start --web&quot;,
      &quot;eject&quot;: &quot;expo eject&quot;
    },
    &quot;dependencies&quot;: {
      &quot;@react-native-community/masked-view&quot;: &quot;0.1.10&quot;,
      &quot;@react-navigation/drawer&quot;: &quot;^5.8.6&quot;,
      &quot;@react-navigation/native&quot;: &quot;^5.7.1&quot;,
      &quot;@react-navigation/stack&quot;: &quot;^5.7.1&quot;,
      &quot;expo&quot;: &quot;~38.0.8&quot;,
      &quot;expo-status-bar&quot;: &quot;^1.0.2&quot;,
      &quot;firebase&quot;: &quot;^7.17.1&quot;,
      &quot;native-base&quot;: &quot;^2.13.13&quot;,
      &quot;react&quot;: &quot;~16.11.0&quot;,
      &quot;react-dom&quot;: &quot;~16.11.0&quot;,
      &quot;react-native&quot;: &quot;https://github.com/expo/react-native/archive/sdk-38.0.2.tar.gz&quot;,
      &quot;react-native-easy-grid&quot;: &quot;^0.2.2&quot;,
      &quot;react-native-elements&quot;: &quot;^2.0.4&quot;,
      &quot;react-native-gesture-handler&quot;: &quot;~1.6.0&quot;,
      &quot;react-native-maps&quot;: &quot;^0.27.1&quot;,
      &quot;react-native-reanimated&quot;: &quot;~1.9.0&quot;,
      &quot;react-native-safe-area-context&quot;: &quot;~3.0.7&quot;,
      &quot;react-native-screens&quot;: &quot;~2.9.0&quot;,
      &quot;react-native-web&quot;: &quot;~0.11.7&quot;,
      &quot;react-router-native&quot;: &quot;^5.2.0&quot;
    },
    &quot;devDependencies&quot;: {
      &quot;@babel/core&quot;: &quot;^7.8.6&quot;,
      &quot;babel-preset-expo&quot;: &quot;~8.1.0&quot;
    },
    &quot;private&quot;: true
  }
  </code></pre>
  <blockquote>
  <p>App.js</p>
  </blockquote>
  <pre><code>export default class App extends React.Component {
    constructor(props) {
      super(props);
      this.state = {
        user: {},
        isReady: false,
      };
    }
    authListener() {
      fire.auth().onAuthStateChanged((user) =&gt; {
        if (user) {
          this.setState({ user });
        } else {
          this.setState({ user: null });
        }
      });
    }
    async componentDidMount() {
      await Font.loadAsync({
        Roboto: require(&quot;native-base/Fonts/Roboto.ttf&quot;),
        Roboto_medium: require(&quot;native-base/Fonts/Roboto_medium.ttf&quot;),
        ...Ionicons.font,
      });
      this.setState({ isReady: true }, () =&gt; {
        this.authListener();
      });
    }
  
    render() {
      if (!this.state.isReady) {
        return &lt;AppLoading /&gt;;
      }
      return (
        &lt;NativeRouter&gt;
          &lt;BackButton /&gt;
          &lt;Switch&gt;
            &lt;Route exact path=&quot;/&quot;&gt;
              {this.state.user ? &lt;DashBoard /&gt; : &lt;Login /&gt;}
            &lt;/Route&gt;
            &lt;Route path=&quot;/criminalDetails&quot; component={ShowSelectedCriminals}&gt;
              {/* {this.state.user ? &lt;ShowSelectedCriminals /&gt; : &lt;Login /&gt;} */}
            &lt;/Route&gt;
            &lt;Route path=&quot;/gangDetails&quot; component={SelectedGangDetails}&gt;
              {/* {this.state.user ? &lt;SelectedGangDetails /&gt; : &lt;Login /&gt;} */}
            &lt;/Route&gt;
            &lt;Route path=&quot;/gangCriminalDetails&quot; component={GangCriminalDetails}&gt;
              {/* {this.state.user ? &lt;GangCriminalDetails /&gt; : &lt;Login /&gt;} */}
            &lt;/Route&gt;
            &lt;Route path=&quot;/ShowGangs&quot;&gt;
              {this.state.user ? &lt;ShowGangs /&gt; : &lt;Login /&gt;}
            &lt;/Route&gt;
            &lt;Route path=&quot;/Showdata&quot;&gt;
              {this.state.user ? &lt;Showdata /&gt; : &lt;Login /&gt;}
            &lt;/Route&gt;
          &lt;/Switch&gt;
        &lt;/NativeRouter&gt;
      );
    }
  }
  
  const styles = StyleSheet.create({
    container: {
      flex: 1,
      backgroundColor: &quot;#fff&quot;,
      alignItems: &quot;center&quot;,
      justifyContent: &quot;center&quot;,
    },
  });
  </code></pre>
  <blockquote>
  <p>Login.js</p>
  </blockquote>
  <pre><code>class Login extends Component {
    constructor(props) {
      super(props);
      this.login = this.login.bind(this);
      this.state = {
        email: &quot;&quot;,
        password: &quot;&quot;,
      };
    }
    login() {
      fire
        .auth()
        .signInWithEmailAndPassword(this.state.email, this.state.password)
        .then((u) =&gt; {
          console.log(u);
        })
        .catch((error) =&gt; {
          console.log(error);
        });
    }
    render() {
      return (
        &lt;View style={styles.container}&gt;
          {/* &lt;Image
            style={{
              height: 25,
              width: 25,
            }}
            source={require(&quot;../assets/login.png&quot;)}
          /&gt; */}
          &lt;Item floatingLabel&gt;
            &lt;Label&gt;Email&lt;/Label&gt;
            &lt;Input onChangeText={(email) =&gt; this.setState({ email })} /&gt;
          &lt;/Item&gt;
          &lt;Item floatingLabel last&gt;
            &lt;Label&gt;Password&lt;/Label&gt;
            &lt;Input
              secureTextEntry={true}
              onChangeText={(password) =&gt; this.setState({ password })}
              placeholder=&quot;Password&quot;
            /&gt;
          &lt;/Item&gt;
  
          &lt;Item
            style={{
              marginTop: 10,
              marginBottom: 10,
              justifyContent: &quot;center&quot;,
              alignItems: &quot;center&quot;,
              borderBottomColor: &quot;white&quot;,
            }}
          &gt;
            &lt;Button info onPress={this.login}&gt;
              &lt;Text&gt; Login &lt;/Text&gt;
            &lt;/Button&gt;
          &lt;/Item&gt;
        &lt;/View&gt;
      );
    }
  }
  const styles = StyleSheet.create({
    container: {
      flex: 1,
      backgroundColor: &quot;#fff&quot;,
      alignItems: &quot;center&quot;,
      justifyContent: &quot;center&quot;,
      backgroundColor: &quot;#2e64ae&quot;,
    },
  });
  export default Login;
  </code></pre>
  <blockquote>
  <p>DashBoard.js</p>
  </blockquote>
  <pre><code>const Drawer = createDrawerNavigator();
  const DashBoardStack = createStackNavigator();
  const ShowGangsStack = createStackNavigator();
  const ShowCriminalsStack = createStackNavigator();
  const DashBoardStackScreen = ({ navigation }) =&gt; (
    &lt;DashBoardStack.Navigator
      screenOptions={{
        headerStyle: {
          backgroundColor: &quot;#2e64ae&quot;,
        },
        headerTintColor: &quot;#fff&quot;,
        headerTitleStyle: {
          fontWeight: &quot;bold&quot;,
        },
      }}
    &gt;
      &lt;DashBoardStack.Screen
        name=&quot;DashBoard&quot;
        component={InitialDb}
        options={{
          title: &quot;CSearch&quot;,
          headerLeft: () =&gt; (
            &lt;TouchableOpacity onPress={() =&gt; navigation.openDrawer()}&gt;
              &lt;Entypo name=&quot;menu&quot; size={24} color=&quot;black&quot; /&gt;
            &lt;/TouchableOpacity&gt;
          ),
          headerRight: () =&gt; (
            &lt;TouchableOpacity onPress={() =&gt; fire.auth().signOut()}&gt;
              &lt;AntDesign name=&quot;logout&quot; size={24} color=&quot;black&quot; /&gt;
            &lt;/TouchableOpacity&gt;
          ),
        }}
      /&gt;
    &lt;/DashBoardStack.Navigator&gt;
  );
  const ShowGangsStackStackScreen = ({ navigation }) =&gt; (
    &lt;ShowGangsStack.Navigator
      screenOptions={{
        headerStyle: {
          backgroundColor: &quot;#2e64ae&quot;,
        },
        headerTintColor: &quot;#fff&quot;,
        headerTitleStyle: {
          fontWeight: &quot;bold&quot;,
        },
      }}
    &gt;
      &lt;ShowGangsStack.Screen
        name=&quot;ShowGangs&quot;
        component={ShowGangs}
        options={{
          title: &quot;CSearch&quot;,
          headerLeft: () =&gt; (
            &lt;TouchableOpacity onPress={() =&gt; navigation.openDrawer()}&gt;
              &lt;Entypo name=&quot;menu&quot; size={24} color=&quot;black&quot; /&gt;
            &lt;/TouchableOpacity&gt;
          ),
          headerRight: () =&gt; (
            &lt;TouchableOpacity onPress={() =&gt; fire.auth().signOut()}&gt;
              &lt;AntDesign name=&quot;logout&quot; size={24} color=&quot;black&quot; /&gt;
            &lt;/TouchableOpacity&gt;
          ),
        }}
      /&gt;
    &lt;/ShowGangsStack.Navigator&gt;
  );
  const ShowCriminalsStackScreen = ({ navigation }) =&gt; (
    &lt;ShowCriminalsStack.Navigator
      screenOptions={{
        headerStyle: {
          backgroundColor: &quot;#2e64ae&quot;,
        },
        headerTintColor: &quot;#fff&quot;,
        headerTitleStyle: {
          fontWeight: &quot;bold&quot;,
        },
      }}
    &gt;
      &lt;ShowCriminalsStack.Screen
        name=&quot;ShowCriminals&quot;
        component={ShowData}
        options={{
          title: &quot;CSearch&quot;,
          headerLeft: () =&gt; (
            &lt;TouchableOpacity onPress={() =&gt; navigation.openDrawer()}&gt;
              &lt;Entypo name=&quot;menu&quot; size={24} color=&quot;black&quot; /&gt;
            &lt;/TouchableOpacity&gt;
          ),
          headerRight: () =&gt; (
            &lt;TouchableOpacity onPress={() =&gt; fire.auth().signOut()}&gt;
              &lt;AntDesign name=&quot;logout&quot; size={24} color=&quot;black&quot; /&gt;
            &lt;/TouchableOpacity&gt;
          ),
        }}
      /&gt;
    &lt;/ShowCriminalsStack.Navigator&gt;
  );
  export default class DashBoard extends React.Component {
    render() {
      return (
        &lt;&gt;
          {/* &lt;Image
            style={{ width: 400, height: 400, borderRadius: 400 / 2 }}
            source={require(&quot;../assets/login.png&quot;)}
          /&gt; */}
          &lt;NavigationContainer&gt;
            &lt;BackButton /&gt;
            &lt;Drawer.Navigator initialRouteName=&quot;DashBoard&quot;&gt;
              &lt;Drawer.Screen name=&quot;DashBoard&quot; component={DashBoardStackScreen} /&gt;
              &lt;Drawer.Screen
                name=&quot;ShowGangs&quot;
                component={ShowGangsStackStackScreen}
              /&gt;
              &lt;Drawer.Screen
                name=&quot;ShowCriminals&quot;
                component={ShowCriminalsStackScreen}
              /&gt;
            &lt;/Drawer.Navigator&gt;
          &lt;/NavigationContainer&gt;
        &lt;/&gt;
      );
    }
  }
  </code></pre>
  <p><strong>Here, in the above code, while running it in metro bundler, using expo run android command, the app is running properly in expo without any issue or error. But When I build the apk using expo build:android, and try to install it in my physical device, then it's showing the splash screen and after that it is showing the white blank screen. Not routing to Login component or DashBoard component either</strong></p>