When running an application on android i get this error. It builds correctly but crashes with exception. I have installed React-native-screens, @React-native/navigation and the dependencies listed on https://reactnavigation.org/docs/getting-started/
com.facebook.react.common.JavascriptException: Invariant Violation: requireNativeComponent: "RNSScreenStackHeaderConfig" was not found in the UIManager.
This error is located at: in RNSScreenStackHeaderConfig in Unknown in RNSScreen in N in ForwardRef in y in E in RNSScreenStack in w in RNCSafeAreaProvider in Unknown in v in Unknown in Unknown in Unknown in ForwardRef in Unknown in ForwardRef in p in c in P in RCTView in View in RCTView in View in h, stack:
It builds and runs on iOS fine but when running on android it crashes completely. Is there something I am overlooking here?
This is my Package json.
{"name": "<myprojectname>","version": "0.0.1","private": true,"scripts": {"android": "react-native run-android","ios": "react-native run-ios","start": "react-native start","test": "jest","lint": "eslint .","postinstall": "npx jetify","android:bundle:debug": "react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res/" },"dependencies": {"@react-native-community/async-storage": "^1.8.1","@react-native-community/masked-view": "^0.1.11","@react-navigation/native": "^6.0.2","@react-navigation/native-stack": "^6.1.0","@react-navigation/stack": "^6.0.7","adbkit": "^2.11.1","moment": "^2.24.0","react": "16.9.0","react-native": "0.63.0","react-native-calendar-strip": "^1.4.1","react-native-calendars": "^1.264.0","react-native-firebase": "^5.6.0","react-native-gesture-handler": "^1.10.3","react-native-reanimated": "^2.2.0","react-native-safe-area-context": "^3.3.1","react-native-screens": "3.1.1","react-native-snap-carousel": "^3.8.4","react-native-vector-icons": "^6.6.0","react-navigation": "^4.4.4","react-navigation-stack": "^2.10.4","react-redux": "^7.2.0","redux": "^4.0.5" },"devDependencies": {"@babel/core": "^7.15.0","babel-jest": "24.9.0","eslint": "^6.5.1","jest": "24.9.0","jetifier": "^1.6.5","metro-react-native-babel-preset": "^0.66.2","react-test-renderer": "16.9.0" },"jest": {"preset": "react-native" }}
I dont really know how to solve this, have tried removing caches, restarting metro, deleting node modules and all "related" errors. This error even happens when I create a fresh project and try installing and using the navigation library.
This is my entrypoint, example copied from React-navigation snack.
import * as React from 'react';import { View, Text } from 'react-native';import { NavigationContainer } from '@react-navigation/native';import { createNativeStackNavigator } from '@react-navigation/native-stack';import { enableScreens } from 'react-native-screens';enableScreens(true);function HomeScreen() { return (<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}><Text>Home Screen</Text></View> );}function DetailsScreen() { return (<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}><Text>Details Screen</Text></View> );}const Stack = createNativeStackNavigator();function AppTest() { return (<NavigationContainer><Stack.Navigator screenOptions={{ headerStyle: { backgroundColor: '#f4511e', }, headerTintColor: '#fff', headerTitleStyle: { fontWeight: 'bold', }, }} initialRouteName="Home"><Stack.Screen options={{ title: 'My home' }} name="Home" component={HomeScreen} /><Stack.Screen options={{ title: 'My home' }} name="Details" component={DetailsScreen} /></Stack.Navigator></NavigationContainer> );}export default AppTest;
Any suggestions?