Invariant-Violation and Uncaught-error while setting up navigation in react-native app

user_19598817 0
Viewed 257

In the process of trying to make my first app in react-native, I tried to set up the navigation in my app. When I changed the App.js from the default function it exports to this

import MovieList from './components/list';
import React from 'react';
import Detail from './components/detail';
import { createAppContainer } from 'react-navigation';
import { createStackNavigator } from 'react-navigation-stack';

const AppNavigator = createStackNavigator({
  MovieList: {screen: MovieList},
  Detail: {screen: Detail},
})

const App = createAppContainer(AppNavigator)

export default App()

I got 2 errors:

  1. "Uncaught error": cannot call a class as a function

  2. Invariant Violation: "main" has not been registered. This can happen if:

  • Metro (the local dev server) is run from the wrong folder. Check if Metro is running, stop it and restart it in the current project.
  • A module failed to load due to an error and AppRegistry.registerComponent wasn't called.

How can I fix these errors?

react-native-navigation react-native reactjs error-handling
1 Answers

solved it by calling App as a class rather than a function by removing the "( )" from

export default App()
user_195988170
Related