This is hard to trace but essentially there was a difference in terms of having bracket in your code, for example, Good i mport Navigator from './tabs/home' ; // Ok, If you have export default defined in your js Fail import { Navigator } from './tabs/home' ; // Works,f you js file has more than a default export. Apparently this has to do with "De-structuring" object in javascript. For example, say you have your components export that looks like this :- export const Tabs = createMaterialTopTabNavigator ({ Home: Home , About: Settings , Contact: Settings },{ tabBarOptions: { activeTintColor: '#000' , inactiveTintColor: 'gray' , style: { backgroundColor: '#fff' , }, indicatorStyle: { backgroundColor: '#000' , }, } }); This works.... . import { Tabs...