React native bottom tab navigation error, brand new app from expo template

Viewed 1172

I just created a new app using expo template, and when executed without any change to code it throws following error

    C02SW0WD:Projects user$ expo init testTabApp
? Choose a template: 
  ----- Managed workflow -----
  blank                 a minimal app as clean as an empty canvas 
  blank (TypeScript)    same as blank but with TypeScript configuration 
***❯ tabs                  several example screens and tabs using react-navigation*** 
  ----- Bare workflow -----
  minimal               bare and minimal, just the essentials to get you started 
  minimal (TypeScript)  same as minimal but with TypeScript configuration 

error detail without any change in code

As an additional test, I created a black project also using expo init (blank -> a minimal app as clean as an empty canvas), the app worked as expected... then I added bottom tab navigation required npms:

  1. yarn add @react-navigation/native
  2. yarn add @react-navigation/bottom-tabs
  3. yarn add react-native-screens
  4. yarn add react-native-safe-area-context

After that I create two empty screens and modified App.js to use bottom tab navigation as follows:

import React from 'react';
import { Text, View } from 'react-native';
import { NavigationContainer } from '@react-navigation/native';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
import Chat from './screens/Chat';
import Home from './screens/Home';

const Tab = createBottomTabNavigator();

export default function App() {
  return (
    <NavigationContainer>
      <Tab.Navigator>
        <Tab.Screen name="Home" component={Home} />
        <Tab.Screen name="Chat" component={Chat} />
      </Tab.Navigator>
    </NavigationContainer>
  );
}

Once again, same error about "undefined is not a function (near '...Object.fromEntries...')"

Any thougts??

1 Answers
Related