Everytime I install react-navigation my project stops working

Question

I'm trying to use react-navigation with my react-native project. The project will work up until I install react-navigation. After I install it when I try to run my app using a virtual device I keep getting an error when I try to use the command react-native run-android.

I'm not sure what happened, but it was working just fine before installing react-navigation. Below is the error I'm getting after I try to start it.

react-native start bundler after using react-native run-android

Answer 1

make the following modifications to MainActivity.java:

package com.reactnavigation.example;

import com.facebook.react.ReactActivity;
import com.facebook.react.ReactActivityDelegate;
import com.facebook.react.ReactRootView;
import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView;

public class MainActivity extends ReactActivity {

  @Override
  protected String getMainComponentName() {
    return "Example";
  }

@Override
 protected ReactActivityDelegate createReactActivityDelegate() {
    return new ReactActivityDelegate(this, getMainComponentName()) {
      @Override
      protected ReactRootView createRootView() {
       return new RNGestureHandlerEnabledRootView(MainActivity.this);
      }
    };
  }
}

Then add the following at the top of your entry file, such as index.js or App.js:

import 'react-native-gesture-handler';

https://reactnavigation.org/docs/en/getting-started.html

Answer 2

Judging by the "EPERM" this error is telling you that you do not have the rights to do the operation. If you have followed the guide on the documentation page and have verified that you have added the lines from the answer written by Anish (to which I edited out the "+" from the lines of code) then you should be able to use the dependency. If the error still shows up, check where you created the project (check that you have the priviledges to write to that folder) and check your code. I would like to point out that in the latest version, react navigation has spilt its dependencies in multiple packages (for example there's one for the stack navigator, one for the tab navigator and so on). Also be sure to install the packages named react-native-reanimated react-native-gesture-handler react-native-screens react-native-safe-area-context .

You should also try to use npm cache clean --force to clean the cache and npm install -g npm@latest --force to install the latest npm globally as administrator.