Simon Degn
Reputation: 968
"RNSScreen" was not found in the UIManager (Android only)
I have been unable to run my React Native application for a few days now. I am going from one issue with dependencies to another...
The last issue here, I cannot solve. When I run the application I get this error message (see full error message in the bottom of the question):
Invariant Violation: requireNativeComponent: "RNSScreen" was not found in the UIManager.
I found this thread but none of the answers seem to work for me and I get the issue on Android only - the iOS version is running fine. I have all the suggested dependencies installed with the latest version, I have clean npn and react native caches, reinstalled the application on my device and much more.
I don't want to initialize a new project and move all the code etc. to this, but it seems like the final solution if I don't get a valid answer soon...
Let me know what you think.
UPDATE (20/11/2021)
I initiated a new React Native project and reinstalled all dependencies. I can run the application in XCode and run it on my iOS device but in Android Studio the application builds but I end up with the same error message:
Invariant Violation: requireNativeComponent: "RNSScreen" was not found in the UIManager.
Here is the content of the package.json file:
{
"name": "MyReactNativeApplication",
"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 ."
},
"dependencies": {
"@bam.tech/react-native-make": "^3.0.3",
"@react-native-async-storage/async-storage": "^1.15.11",
"@react-native-clipboard/clipboard": "^1.9.0",
"@react-native-community/cli": "^6.2.0",
"@react-native-community/datetimepicker": "^3.5.2",
"@react-native-community/masked-view": "^0.1.11",
"@react-native-community/push-notification-ios": "^1.10.0",
"@react-native-firebase/app": "^12.9.3",
"@react-native-seoul/masonry-list": "^1.1.1",
"@react-navigation/bottom-tabs": "^6.0.9",
"@react-navigation/material-top-tabs": "^6.0.6",
"@react-navigation/native": "^6.0.6",
"@react-navigation/stack": "^6.0.11",
"react": "17.0.2",
"react-native": "0.66.3",
"react-native-actionsheet": "^2.4.2",
"react-native-add-calendar-event": "^4.0.0",
"react-native-admob": "^2.0.0-beta.6",
"react-native-admob-native-ads": "^0.4.1",
"react-native-animatable": "^1.3.3",
"react-native-autolink": "^4.0.0",
"react-native-calendars": "^1.1268.0",
"react-native-code-input": "^1.0.6",
"react-native-confirmation-code-field": "^7.1.0",
"react-native-contacts": "^7.0.2",
"react-native-eject": "^0.1.2",
"react-native-elements": "^3.4.2",
"react-native-event-listeners": "^1.0.7",
"react-native-fast-image": "^8.5.11",
"react-native-gesture-handler": "^1.10.3",
"react-native-get-location": "^2.1.2",
"react-native-haptic-feedback": "^1.13.0",
"react-native-image-picker": "^4.3.0",
"react-native-input-scroll-view": "^1.11.0",
"react-native-localize": "^2.1.5",
"react-native-maps": "^0.28.1",
"react-native-modal-datetime-picker": "^10.2.0",
"react-native-notifications": "^4.1.2",
"react-native-pager-view": "^5.4.9",
"react-native-parallax-scroll-view": "^0.21.3",
"react-native-parallax-scrollview": "^3.0.0",
"react-native-push-notification": "^8.1.1",
"react-native-reanimated": "^2.2.4",
"react-native-rheostat": "^1.0.2",
"react-native-safe-area": "^0.5.1",
"react-native-safe-area-context": "^3.3.2",
"react-native-screens": "^3.9.0",
"react-native-segmented-control-tab": "^3.4.1",
"react-native-slider": "^0.11.0",
"react-native-snap-carousel": "^3.9.1",
"react-native-svg": "^12.1.1",
"react-native-tab-view": "^3.1.1",
"react-native-tracking-transparency": "^0.1.1",
"react-native-vector-icons": "^8.1.0",
"react-native-video": "^5.2.0",
"react-navigation": "^4.4.4",
"rn-segmented-control": "^0.2.8",
"rn-sliding-up-panel": "^2.4.5",
"yarn": "^1.22.17"
},
"devDependencies": {
"@babel/core": "^7.16.0",
"@babel/runtime": "^7.16.3",
"@react-native-community/eslint-config": "^3.0.1",
"babel-jest": "^27.3.1",
"eslint": "^8.2.0",
"jest": "^27.3.1",
"metro-react-native-babel-preset": "^0.66.2",
"react-test-renderer": "17.0.2"
},
"jest": {
"preset": "react-native"
}
}
UPDATE (21/11/2021)
Full error message:
ERROR Invariant Violation: requireNativeComponent: "RNSScreen" was not found in the UIManager.
This error is located at:
in RNSScreen (at createAnimatedComponent.js:242)
in AnimatedComponent (at createAnimatedComponent.js:295)
in AnimatedComponentWrapper (at src/index.native.tsx:208)
in Screen (at Screens.tsx:37)
in MaybeScreen (at CardStack.tsx:642)
in RNSScreenContainer (at src/index.native.tsx:277)
in ScreenContainer (at Screens.tsx:20)
in MaybeScreenContainer (at CardStack.tsx:561)
in RCTView (at View.js:32)
in View (at Background.tsx:13)
in Background (at CardStack.tsx:559)
in CardStack (at StackView.tsx:437)
in RCTView (at View.js:32)
in View (at SafeAreaProviderCompat.tsx:42)
in SafeAreaProviderCompat (at StackView.tsx:430)
in RCTView (at View.js:32)
in View (at GestureHandlerRootView.android.tsx:21)
in GestureHandlerRootView (at StackView.tsx:429)
in StackView (at createStackNavigator.tsx:118)
in Unknown (at createStackNavigator.tsx:117)
in StackNavigator (at App.js:244)
in LandingStack (at SceneView.tsx:126)
in StaticContainer
in EnsureSingleNavigator (at SceneView.tsx:118)
in SceneView (at useDescriptors.tsx:210)
in RCTView (at View.js:32)
in View (at CardContainer.tsx:280)
in RCTView (at View.js:32)
in View (at CardContainer.tsx:278)
in RCTView (at View.js:32)
in View (at CardSheet.tsx:33)
in CardSheet (at Card.tsx:557)
in RCTView (at View.js:32)
in View (at createAnimatedComponent.js:242)
in AnimatedComponent (at createAnimatedComponent.js:295)
in AnimatedComponentWrapper (at Card.tsx:536)
in PanGestureHandler (at GestureHandlerNative.tsx:14)
in PanGestureHandler (at Card.tsx:530)
in RCTView (at View.js:32)
in View (at createAnimatedComponent.js:242)
in AnimatedComponent (at createAnimatedComponent.js:295)
in AnimatedComponentWrapper (at Card.tsx:526)
in RCTView (at View.js:32)
in View (at Card.tsx:520)
in Card (at CardContainer.tsx:218)
in CardContainer (at CardStack.tsx:649)
in MaybeFreeze (at src/index.native.tsx:229)
in RNSScreen (at createAnimatedComponent.js:242)
in AnimatedComponent (at createAnimatedComponent.js:295)
in AnimatedComponentWrapper (at src/index.native.tsx:208)
in Screen (at Screens.tsx:37)
in MaybeScreen (at CardStack.tsx:642)
in RNSScreenContainer (at src/index.native.tsx:277)
in ScreenContainer (at Screens.tsx:20)
in MaybeScreenContainer (at CardStack.tsx:561)
in RCTView (at View.js:32)
in View (at Background.tsx:13)
in Background (at CardStack.tsx:559)
in CardStack (at StackView.tsx:437)
in RNCSafeAreaProvider (at SafeAreaContext.tsx:76)
in SafeAreaProvider (at SafeAreaProviderCompat.tsx:46)
in SafeAreaProviderCompat (at StackView.tsx:430)
in GestureHandlerRootView (at GestureHandlerRootView.android.tsx:26)
in GestureHandlerRootView (at StackView.tsx:429)
in StackView (at createStackNavigator.tsx:118)
in Unknown (at createStackNavigator.tsx:117)
in StackNavigator (at App.js:710)
in EnsureSingleNavigator (at BaseNavigationContainer.tsx:430)
in BaseNavigationContainer (at NavigationContainer.tsx:132)
in ThemeProvider (at NavigationContainer.tsx:131)
in NavigationContainerInner (at App.js:689)
in App (at renderApplication.js:50)
in RCTView (at View.js:32)
in View (at AppContainer.js:92)
in RCTView (at View.js:32)
in View (at AppContainer.js:119)
in AppContainer (at renderApplication.js:43)
in MyReactNativeApplication(RootComponent) (at renderApplication.js:60)
WARN Possible Unhandled Promise Rejection (id: 0):
Invariant Violation: requireNativeComponent: "RNSScreen" was not found in the UIManager.
invariant@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:2391:26
getNativeComponentAttributes@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:53270:48
http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:52823:28
createInstance@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:7143:46
completeWork@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:14962:48
completeUnitOfWork@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:17830:34
performUnitOfWork@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:17807:29
workLoopSync@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:17736:28
renderRootSync@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:17712:25
performSyncWorkOnRoot@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:17473:40
performSyncWorkOnRoot@[native code]
flushSyncCallbacks@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:7798:36
flushSyncCallbacksOnlyInLegacyMode@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:7779:29
scheduleUpdateOnFiber@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:17160:49
dispatchAction@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:11805:43
dispatchAction@[native code]
_callee$@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:251553:27
tryCatch@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:24265:23
invoke@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:24435:32
tryCatch@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:24265:23
invoke@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:24337:30
http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:24347:21
tryCallOne@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:28942:16
http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:29043:27
http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:29634:26
_callTimer@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:29530:17
_callReactNativeMicrotasksPass@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:29569:17
callReactNativeMicrotasks@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:29779:44
__callReactNativeMicrotasks@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:3049:46
http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:2827:45
__guard@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:3032:15
flushedQueue@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.MyReactNativeApplication.app&modulesOnly=false&runModule=true:2826:21
flushedQueue@[native code]
callFunctionReturnFlushedQueue@[native code]
UPDATE (24/11/2021)
No solution found yet. I can run my app when deleting most of my app.js-file. I can keep all imports, set all variables and render something but take a look at this...
This is able to run:
render() {
const LoadingRootStack = createStackNavigator();
return (
<NavigationContainer linking={linking} fallback={<Text>Loading...</Text>}>
<View>
<Text>hello world</Text>
</View>
</NavigationContainer>
);
}
But this is causing the error above:
render() {
const LoadingRootStack = createStackNavigator();
return (
<NavigationContainer linking={linking} fallback={<Text>Loading...</Text>}>
<View>
<Text>hello world</Text>
</View>
<LoadingRootStack.Navigator initialRouteName="Loading">
<LoadingRootStack.Screen name="Loading" component={LoadingStack} options={{headerShown:false}}/>
</LoadingRootStack.Navigator>
</NavigationContainer>
);
}
I have checked the installation for createStackNavigator / @react-navigation/stack but everything seems fine...
Please help me! :-)
Upvotes: 1
Views: 8877
Answers (1)
Stathis Ntonas
Reputation: 1262
I've reached Simon on reddit and we solved the issue.
The project had misconfigured navigation and Android project had lots of leftovers from older versions of React Native. Also the project wasn't jetified.
The weirdest part was that after project cleanup and properly configured navigation the bug still persisted. What potentially fixed it was the implementation of Multidex on MainApplication.java and removal of import com.facebook.react.shell.MainReactPackage
+ import androidx.multidex.MultiDex;
- import com.facebook.react.shell.MainReactPackage;
+ @Override
+ protected void attachBaseContext(Context base) {
+ super.attachBaseContext(base);
+ MultiDex.install(this);
+ }
android/app/build.gradle
defaultConfig {
applicationId "xxxxx"
minSdkVersion rootProject.ext.minSdkVersion
targetSdkVersion rootProject.ext.targetSdkVersion
versionCode 1
versionName "1.0"
multiDexEnabled true
}
...
dependencies {
implementation 'androidx.multidex:multidex:2.0.1'
...
}
Upvotes: 4
Related Questions
- Invariant Violation: requireNativeComponent: "RNSVGPath" was not found in the UIManager
- requireNativeComponent: "RNSScreenStackHeaderConfig" was not found in the UIManager when running android app
- "RNCSafeAreaView" was not found in the UIManager
- 'Invariant Violation: requireNativeComponent: "RNSScreen" was not found in the UIManager.' error in react native cli
- Invariant Violation: RNCSafeAreaProvider was not found in the UIManager
- Invariant Violation: requireNativeComponent: "RNSScreen" was not found in the UIManager
- How to fix "RNCSafeAreaProvider" was not found in the UIManager Error
- ReferenceError: Can't find variable: _UIManager
- requireNativeComponent: "RNGestureHandlerRootView" was not found in the 'UIManager'
- how to fix : "RNCSafeprovider was not found in UIManager on React Native