Search code examples
javascriptreactjsreact-nativeexponentjs

ExNavigation throws an error saying initialRoute is not defined


Hi I'm new to Expo but I've been having a hard time trying to run my code. I'm stuck at having the error: You must specify initialRoute or initialStack to initialize this StackNavigation even though I already set it up.

Here's my main.js

import Expo from 'expo'
import React from 'react'
import { createStore } from 'redux'
import { Provider } from 'react-redux'
import {
  NavigationProvider,
  StackNavigation,
} from '@expo/ex-navigation'
import RootReducer from './src/reducers'
import Router from './src/navigation/Router'

const store = createStore(RootReducer)

const App = () => (
  <Provider store={store}>
    <NavigationProvider router={Router}>
      <StackNavigation intitialRoute={Router.getRoute('splash')} />
    </NavigationProvider>
  </Provider>
)

Expo.registerRootComponent(App)

Here's my Router.js

import { createRouter } from '@expo/ex-navigation'

// Screens
import SplashScreen from '../screens/SplashScreen'
import LoginScreen from '../screens/LoginScreen'

const Router = createRouter(() => ({
  splash: () => SplashScreen,
  login: () => LoginScreen,
}))

export default Router

What seems to be the problem at my setup? I just followed the example on ExNavigation.

Here's my example on Sketch but can't make it run but will leave the link for the full code.


Solution

  • You have a typo in the prop's name in this part of the code

    <StackNavigation intitialRoute={Router.getRoute('splash')} />
    

    It is initialRoute instead of intitialRoute.