Henrik
Henrik

Reputation: 928

React Native Unable to resolve module

error: Error: Unable to resolve module react-native-safe-area-context from C:\USER\App\NavigationApp\NavigationApp\node_modules\@react-navigation\stack\src\views\Stack\StackView.tsx: react-native-safe-area-context could not be found within the project.

I didn't wrote anything and just wanted to learn React Navigation. I installed @react-navigation/native and thought now I could start. But instead of JSX I get this error: What to do?

My code:

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


import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';


const App = () => {
  return (
    <View>
      <Text>Hello</Text>
    </View>
  );
};

const styles = StyleSheet.create({

});

export default App;

Upvotes: 0

Views: 4221

Answers (2)

pacy.eth
pacy.eth

Reputation: 176

react-navigation package needs couple of other packages to work and react-native-safe-area-context is part of them, you only need to install it $ npm i --save react-native-safe-area-context

Read more here (https://reactnavigation.org/docs/getting-started/) Happy coding

Upvotes: 2

Mudassar hassan
Mudassar hassan

Reputation: 171

Did you installed dependencies of react navigation? react-native-safe-area-context is one of the dependency. There are other dependencies that you should install for things to start work. To do so run this command if you are using expo managed workflow.

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

or if you are using bare work flow(react native CLI) run this

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

Also you should read the offical installation doc

Upvotes: 1

Related Questions