Unable to resolve module 'react-navigation'

Question

Here is the error I get:

package.json

{
  "name": "LoginApp2",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "react": "16.0.0-alpha.12",
    "react-native": "0.48.3"
  },
  "devDependencies": {
    "babel-jest": "21.2.0",
    "babel-preset-react-native": "4.0.0",
    "jest": "21.2.1",
    "react-test-renderer": "16.0.0-alpha.12"
  },
  "jest": {
    "preset": "react-native"
  }
}

index.js

  import React, { Component } from 'react';
import { AppRegistry,View,Text,StyleSheet } from 'react-native';

import UsersManager from './pages/app';
AppRegistry.registerComponent('LoginApp2', () => UsersManager);

pages/app.js

import React, { Component } from 'react';
import { AppRegistry,View,Text,StyleSheet,ScrollView,TouchableOpacity } from 'react-native';
import { StackNavigator } from 'react-navigation';

import HomeScreen from './home';
import Login from './login';
import Register from './register';
import Profile from './profile';

const UsersManager = StackNavigator({
Home: { screen: HomeScreen },
Login: { screen: Login },
Register: {screen: Register},
Profile: {screen: Profile}

});
export default UsersManager;

Can someone please help me solve this issue?

Answer 1

This error means that either you haven't installed the react-navigation module or that you have installed the module but didn't re-built your project using react-native run-android or react-native run-ios.

---

Following these steps should solve your issue:

1. Install react-navigation module.
2. Re-build your project.
3. Restart the packager by stopping the current packager and then starting the packager again with react-native start.

Answer 2

We need to install the following dependencies:

npm i react-navigation @react-native-community/masked-view react-native-gesture-handler react-native-reanimated react-native-safe-area-context react-native-screens

In code import the following:

import {createAppContainer} from 'react-navigation'; 
import {createStackNavigator} from 'react-navigation-stack';

Answer 3

Date : 25-June-2020 Working :

Follow this steps:

1. Install React Navigation npm install react-navigation

2. Install Dependencies expo install react-native-gesture-handler react-native-reanimated react-native-screens react-native-safe-area-context @react-native-community/masked-view

3. Install React Navigation Stack npm install react-navigation-stack @react-native-community/masked-view

4. Start the app and clear cache with npm start -c