Unrecognized font family Material Icons?

Question

Iam new to React-Native, I have added react-native-vector-icons library manually to Xcode and Android studio. if run the code with Xcode its executing successfully without any issue. but if i trying to run the code from Terminal (react-native run-ios) its showing 'Unrecognized font family Material' in simulator. but the same this working if i runs the command (react-native run-android).

please help me. this is the error showing in terminal Error Screen shot

** BUILD FAILED **


The following build commands failed:

    CompileC /Users/user/Documents/Test/JobsNProfiles/ios/build/Build/Intermediates.noindex/RNVectorIcons.build/Debug-iphonesimulator/RNVectorIcons.build/Objects-normal/x86_64/RCTFont+FA5.o /Users/user/Documents/Test/JobsNProfiles/node_modules/react-native-vector-icons/RNVectorIconsManager/RCTFont+FA5.m normal x86_64 objective-c com.apple.compilers.llvm.clang.1_0.compiler
(1 failure)

Janycejanyte

github.com/oblador/react-native-vector-icons#ios – Dandrea

Answer 1

I am not sure what exactly you are missing in your configuration, so I am gonna state all what I believe is the case:

1. Delete ios/build folder, then try automatic linking: react-native link react-native-vector-icons.

2. Make sure you have checked that the font is copied in the Copy Bundle Resources in Build Phases. If not, re-check the manual configuration steps.

3. Make sure you kill the packager and re-run for changes to take effect.

Godesberg

Thank you i have deleted the build folder and re-build it then its working. – Janycejanyte

Did not work for me. There is a new fix for this issue? I have searched for hours with no success. – Ealasaid

This answer may be outdated ... the correct answer is https://mcmap.net/q/212559/-unrecognized-font-family-material-icons (Answer by Seishin) – Udale

Answer 2

The solution I found is to check if the fonts are added to the UIAppFonts array in the Info.plist file:

<key>UIAppFonts</key>
<array>
 <string>AntDesign.ttf</string>
 <string>Entypo.ttf</string>
 <string>EvilIcons.ttf</string>
 <string>Feather.ttf</string>
 <string>FontAwesome.ttf</string>
 <string>FontAwesome5_Brands.ttf</string>
 <string>FontAwesome5_Regular.ttf</string>
 <string>FontAwesome5_Solid.ttf</string>
 <string>Foundation.ttf</string>
 <string>Ionicons.ttf</string>
 <string>MaterialIcons.ttf</string>
 <string>MaterialCommunityIcons.ttf</string>
 <string>SimpleLineIcons.ttf</string>
 <string>Octicons.ttf</string>
 <string>Zocial.ttf</string>
</array>

For more information here

Duvall

Thank you that works like a charm, you saved my day – Maynord

Where is this file? A search for UIAppFonts turns up nothing – Railey

Answer 3

Simplest of all

You can simply add the following to your Podfile

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


# If you are using monorepo
# pod 'RNVectorIcons', :path => '../../../node_modules/react-native-vector-icons'

and run

yarn podinstall

Dandrea