Home > OS >  expo app error when creating stack navigator
expo app error when creating stack navigator

Time:01-08

I keep getting the error when I write this:

const Stack = createStackNavigator();

i have installed everything required for it but it gives me this error

undefined is not an object (evaluating 'Object.keys(routeConfigs)')

Here is my code:

                  import { StatusBar } from 'expo-status-bar';
                  import React from 'react';
                  import { StyleSheet, Text, View } from 'react-native';
                  import {Home} from './screens/homepage/home';
                  import { useFonts } from 'expo-font';
                  import { NavigationContainer, StackActions } from '@react- 
                  navigation/native';
                  import { createStackNavigator } from 'react-navigation-stack';

                  export default function App() {


                    function HomeScreen() {
                      return(
                        <View>
                          <Text>Hello</Text>
                        </View>
                      )
                    }

                    const Stack = createStackNavigator();

                    let [fontsLoaded] = useFonts({
                      'Main': require('./assets/century.ttf'),
                      'Main-Bold': require('./assets/century-bold.ttf')
                    });
                    if(!fontsLoaded) {
                      return <Text>Waiting...........</Text>
                    }
                    return (
                      <NavigationContainer>
                        <Stack.Navigator>
                          <Stack.Screen style={styles.container} name="Home" component= 
                          {HomeScreen}/>
                        </Stack.Navigator>
                      </NavigationContainer>
                    );
                  }


                  const styles = StyleSheet.create({
                    container: {  
                      height:'100%',
                      backgroundColor:'#141F2B',
                    },
                  });

CodePudding user response:

try installing @react-navigation/stack and @react-navigation/native, then try doing this:

import { createStackNavigator } from "@react-navigation/stack";
import { NavigationContainer } from "@react-navigation/native";

const Stack = createStackNavigator();

<NavigationContainer>
    <Stack.Navigator>
        <Stack.Screen
            style= {styles.container} 
            name= "Home" 
            component= {HomeScreen}
         />
    </Stack.Navigator>
</NavigationContainer>
  • Related