Moving createBottomTabNavigator into Separate File

Created a Snack for this:

“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?

You’ were trying to import the navigator as a default import but you defined it as a named export (check this out createBottomTabNavigator in separate file - Snack)

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)

1 Like

Good explanation, thanks!

This topic was automatically closed 15 days after the last reply. New replies are no longer allowed.