I am new to react native and I am trying to create an app with stack navigation. This is what I have on my App.js
import React from "react";
import { View, Text } from "react-native";
// Import React Navigation
import { createStackNavigator, createAppContainer } from 'react-navigation'
// Import the screens
import Main from './components/Main';
import Chat from './components/Chat';
// Create the navigator
const navigator = createStackNavigator({
Main: { screen: Main },
Chat: { screen: Chat },
});
const App = createAppContainer(navigator)
export default navigator
This is also the error I am getting
Invariant Violation: The navigation prop is missing for this navigator. In react-navigation 3 you must set up your app container directly. More info: https://reactnavigation.org/docs/en/app-containers.html
This error is located at:
in Navigator (at createKeyboardAwareNavigator.js:12)
in KeyboardAwareNavigator (at registerRootComponent.js:17)
in RootErrorBoundary (at registerRootComponent.js:16)
in ExpoRootComponent (at renderApplication.js:34)
in RCTView (at View.js:44)
in RCTView (at View.js:44)
in AppContainer (at renderApplication.js:33)
- node_modules/@react-navigation/core/src/navigators/createNavigator.js:19:8 in getDerivedStateFromProps
- node_modules/react-native/Libraries/Renderer/oss/ReactNativeRenderer-dev.js:7663:46 in applyDerivedStateFromProps
- ... 20 more stack frames from framework internals
I am obviously doing something wrong, please assist