Moving createBottomTabNavigator into Separate File

[pathaugen]

Created a Snack for this:
https://snack.expo.io/@pathaugen/createbottomtabnavigator-in-separate-file

“The component for route ‘ROUTENAME’ must be a React component.”

In the Snack, the name is ‘genericAppTabNav’ in the /navigation/GenericAppTabNav.js file.

With createStackNavigator, I use:
export const NAME = createStackNavigator(…)

However I can’t get createBottomTabNavigator to work in the same way:
export const GenericAppTabNav = createBottomTabNavigator(…)

What is the correct way to get a createBottomTabNavigator in a separate file?

[thetc]

You’ were trying to import the navigator as a default import but you defined it as a named export (check this out https://snack.expo.io/HJwwu_rZQ)

import Foo from './file' is just syntactic sugar for import { default as Foo } from './file' if you want a named export you’ll need to import { Foo } from './file' (or update your export to be the default)

[pathaugen]

Good explanation, thanks!