Search code examples
react-nativereact-native-vector-icons

React-Native - Unrecognized font family 'Ionicons'

my react version is over 0.6

  1. i successfully install vector icons first npm install react-native-vector-icons
  2. i did npx pod-install successfully (I don't use react-native link because it gives error and also when i check react-native > 0.6 there is autolinking usage so react-native link not preferable in react-native > 0.6)
  3. Than i ran my app with this command

npx react-native run-ios --simulator="iPhone 8"

  1. in my App.js file there is import like this. Also library shows no error !

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

  1. But when i want to use ionicons in JSX like this
<Ionicons
   name="information-circle-outline"
   size={40}
   color="blue"
/>

I got this error Unrecognized font family 'Ionicons'

than i ran react-native link react-native-vector-icons

also when i build by linking my build was failed. But when i unlink my build is successfull.

I don't understand where i make a mistake

enter image description here

Solution

  • Since when you try to link it it fails. Try doing the linking manually.

    Add this to your podfile in ios/Podfile

    pod 'RNVectorIcons', :path => '../node_modules/react-native-vector-icons'

    then run pod update in the terminal and make sure your in the ios folder.

    In addition you must follow there Info.plist instructions as well in there documentation.