Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s%s, undefined, You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
Check your code at HeaderBackButton.tsx:152.
My code is the following:
const Home: FunctionComponent<HomeProps> = (props: HomeProps) => {
return (
<View style={styles.container}>
<View>
<Text>{"Listo para jugar Cuarenta ? "}</Text>
</View>
<View style={styles.button}>
<Button title="Rules" onPress={() => {
console.log("Props", props);
props.navigation.navigate('Cuarenta');
}}/>
</View>
<View style={styles.button}>
<Button title="New Game" onPress={() => {
props.navigation.navigate('Game');
}}></Button>
</View>
<View style={styles.button}>
<Button title="Tablero" onPress={() => {
props.navigation.navigate('Tablero');
}}></Button>
</View>
<View style={styles.button}>
<Button title="Robot" onPress={() => {
props.navigation.navigate('RobotScene');
}}></Button>
</View>
</View>
)
}export default function App() {
return (
<NavigationContainer>
<Stack.Navigator
screenOptions={{
headerStyle: {
backgroundColor: '#f41e9e',
},
headerTintColor: '#fff',
headerTitleStyle: {
fontWeight: 'bold',
},
}}
>
<Stack.Screen
name='Home'
component={Home}
options={{title: 'Juego de Cuarenta'}}
/>
<Stack.Screen
name='Cuarenta'
component={Cuarenta}
/>
<Stack.Screen
name='Game'
component={GameScene}
/>
<Stack.Screen
name='Tablero'
component={Tablero}
/>
<Stack.Screen
name='RobotScene'
component={RobotScene}
/>
</Stack.Navigator>
</NavigationContainer>
);
}