score:-1

Install react-native screens and that should resolve the issue.

yarn add react-native-screens

score:-1

steps:

  1. stop you metro connection
  2. restart you app

Then it will work.

score:-1

yarn add react-native-screens

or

npm i react-native-screens

score:0

Caveat: I realize this post is for android, but I'm wondering if it is an issue with installing the cocoa pods after talking to a colleague about this issue.

Hope you all are well! I too, was having this and wanted to add what worked for me. I'm working on a RN project with my first gig outta bootcamp, so I'm also pretty new to these builds. However, it's my understanding that anytime you run pod install you need to run the project from xcode in order to link the pods with node_modules.

To do this you'll want to:

  • Run xcode
  • Go to your project folder in question
  • Go to ios folder
  • Open <project_name>.xcworkspace
  • Click the play button on the top left to build the project (If you have a simulator selected, it should open the app once built)

After finishing these steps, I no longer had that error message.

score:0

Changing settings.gradle and app/build.gradle was not enough. The following changes to MainApplication.java are needed:

    List<ReactPackage> packages = new PackageList(this).getPackages();
    // Packages that cannot be autolinked yet can be added manually here, for example:
    // packages.add(new MyReactNativePackage());
    packages.add(new com.swmansion.reanimated.ReanimatedPackage());
    packages.add(new com.swmansion.gesturehandler.react.RNGestureHandlerPackage());
    packages.add(new com.swmansion.rnscreens.RNScreensPackage());
    packages.add(new com.th3rdwave.safeareacontext.SafeAreaContextPackage());

score:0

I just fix the issue, and this issue is an manual linking issue actually.

Following previous answers is not enough.

Here is my complete changes.

// settings.gradle

include ':react-native-screens'
project(':react-native-screens').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-screens/android')
include ':react-native-reanimated'
project(':react-native-reanimated').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-reanimated/android')
include ':react-native-gesture-handler'
project(':react-native-gesture-handler').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-gesture-handler/android')
include (':react-native-safe-area-context')
project(':react-native-safe-area-context').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-safe-area-context/android')
//app/build.gradle

dependencies {
...
    implementation project(':react-native-screens')
    implementation project(':react-native-reanimated')
    implementation project(':react-native-gesture-handler')
    implementation project(':react-native-safe-area-context')

}

And one more step.

//MainApplication.java

@override
protected List<ReactPackage> getPackages(){

    ...
    packages.add(new com.swmansion.rnscreens.RNScreensPackage());
    //My Metro told me that RNGestureHandlerPackage is created twice, hence I comment the line, and then everything works.
    // packages.add(new com.swmansion.gesturehandler.RNGestureHandlerPackage());
    packages.add(new com.th3rdwave.safeareacontext.SafeAreaContextPackage());
    packages.add(new com.swmansion.reanimated.ReanimatedPackage());

ref: https://github.com/software-mansion/react-native-gesture-handler/issues/684

score:0

I face same Issue, so you just have to close project from emulator. and re-run .Error gone

score:1

Did you make the changes given in the documentation? As per this https://reactnavigation.org/docs/getting-started/ you need to make changes in MainActivity.java which is located in android/app/src/main/java/<your package name>/MainActivity.java

Add this at the very start of the file import android.os.Bundle;

and then add @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(null); }

Once again go through the documentation

score:1

Add in "settings.gradle"

include ':react-native-screens'
project(':react-native-screens').projectDir = new 
File(rootProject.projectDir, '../node_modules/react-native- 
screens/android')
include ':react-native-reanimated'
project(':react-native-reanimated').projectDir = new 
File(rootProject.projectDir, '../node_modules/react-native- 
reanimated/android')
include ':react-native-gesture-handler'
project(':react-native-gesture-handler').projectDir = new 
File(rootProject.projectDir, '../node_modules/react-native-gesture- 
handler/android')
include (':react-native-safe-area-context')
project(':react-native-safe-area-context').projectDir = new 
File(rootProject.projectDir, '../node_modules/react-native-safe-area- 
context/android')
include ':app'

add in "app/build.gradle" 

implementation project(':react-native-screens')
implementation project(':react-native-reanimated')
implementation project(':react-native-gesture-handler')
implementation project(':react-native-safe-area-context')

Just Making above only 2 changes  your project will work fine. 
Thanks.... 

score:1

I encountered this problem after setting up navigation for ios. Here is the solution I found:

  1. In the terminal, run npx pod-install ios because as explained in the docs, "If you're on a Mac and developing for iOS, you need to install the pods (via Cocoapods) to complete the linking."
  2. Quit my simulator
  3. Terminated and re-ran npx react-native start
  4. Terminated and re-ran npx react-native run-ios

After completing these steps the app ran successfully again.

score:2

Solution have in documentation of reactnavigation doc

After install @react-navigation/native you have to install two dependency npm install react-native-screens react-native-safe-area-context it's mention library.

NB: react-native-screens package requires one additional configuration step to properly work on Android devices. Edit MainActivity.java file which is located in

android/app/src/main/java/<your package name>/MainActivity.java.

Add the following code to the body of MainActivity class:

@Override
protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(null);
}

and make sure to add an import statement at the top of this file:

import android.os.Bundle;

score:2

If someone ends up here with this issue while using nrwl/nx mono-repo for cross-platform build (mobile and web), you need to add the react-native-screens and react-native-safe-area-context dependency in the mobile application package.json besides the workspace package.json.

score:3

Mihir Panchal Thanks for the reply but I found a solution myself.

SOLUTION.

I followed the instructions in the documentation. Did not work any differently.

I saw that some projects where imported in these 3 files: settings.gradle, app/build.gradle and mainactivity.java ex.

Settings.gradle:

include ':react-native-firebase'
project(':react-native-firebase').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-firebase/android')
include ':react-native-gesture-handler'
project(':react-native-gesture-handler').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-gesture-handler/android')
include ':react-native-vector-icons'
project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android')
include ':react-native-screens'
project(':react-native-screens').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-screens/android')
include ':react-native-reanimated'
project(':react-native-reanimated').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-reanimated/android')

include ':react-native-gesture-handler'
project(':react-native-gesture-handler').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-gesture-handler/android')
include (':react-native-safe-area-context')
project(':react-native-safe-area-context').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-safe-area-context/android')
include ':app'

...

app/build.gradle

  implementation project(':react-native-screens')
    implementation project(':react-native-reanimated')
    implementation project(':react-native-gesture-handler')
    implementation project(':react-native-safe-area-context')

and finally in my mainApplication.java

  @Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
          new MainReactPackage(),
            new AsyncStoragePackage(),
            new RNFirebasePackage(),
            new RNFirebaseFirestorePackage(),
            new RNFirebaseLinksPackage(),
            new RNFirebaseAuthPackage(),
            new ReanimatedPackage(),
            new RNGestureHandlerPackage(),
            new RNScreensPackage(),
            new SafeAreaContextPackage()
      );
    }

To get the librarys to work and everything to be setup it had to be linked here. Don't know if this helps anyone but I was stuck for some time and doing this made the application work as expected. Might be easy to miss if you are not experienced(I am not very experienced with RN)

score:3

Kill Metro and clean gradle build (it might take a minute or two):

cd android
.\gradlew clean

Start Metro and clear cache:

npm start --reset-cache

Recompile

npm run android

Also, make sure in MainActivity.java you have added import android.os.Bundle; BELOW package com.your_package_name. Description on https://reactnavigation.org/docs/getting-started/ for some people might suggest to put it on very top of this file, but this is wrong thinking. This is how it should look like:

package com.your_package_name;
import android.os.Bundle;

score:4

i encountered the same issue ater Editing MainActivity.java file which is located in android/app/src/main/java/<your package name>/MainActivity.java while following react-navigation-getting-started-guide

you need to stop the metro-server

and then, run react-native run-android

score:4

You just need to make sure installing the dependencies after installing stack on windows run this code:

npm install react-native-screens react-native-safe-area-context

score:5

I had the same issue, I just reloaded my emulator via xCode and it worked.

score:10

I faced this issue on ios during my work on navigation.

I'm not sure what exactly solved the issue. I reinstalled all the navigation packages and ran npx pod-install, cleaned metro cache, build data, derived data and the error disappeared.


Related Query

More Query from same tag