Icons don't show up in react-navigation v5

Question

I am looking for Icons beside names on tab navigation but i i am getting this error:

I don't use expo then i imported by this way:

import { Ionicons } from 'react-native-vector-icons/Ionicons';

And:

import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';

This is the main code:

const MainTab=()=>{

  const Tab = createBottomTabNavigator();

  return(

<Tab.Navigator

screenOptions={({route})=>({
 tabBarIcon:({color, size})=>{
  let iconName;

  if (route.name=='Home') {

    iconName='ios-home'

  }else if(route.name=='Settings'){

  iconName='logo-settings'
 }

 return <Ionicons name={iconName} size={size} color={color} />
 }
})}
>


<Tab.Screen name="Home" component={Home} />

<Tab.Screen name="Settings" component={SecondPage} />


</Tab.Navigator>

  )}

Which part have i made mistake?

Answer 1

In your statement

import { Ionicons } from 'react-native-vector-icons/Ionicons';

You are using the curly brackets to extract Ionicons from it's default export, but it is the default export, so simply:

import Ionicons from 'react-native-vector-icons/Ionicons';