React-native-vector-icons: Cannot install on IOS - RN version 0.62.2

[Younanator]

• [ ] Review the documentation: https://github.com/oblador/react-native-vector-icons
• [ ] Search for existing issues (including closed ones): https://github.com/oblador/react-native-vector-icons/issues

RN - 0.62.2

All options for IOS installation, none work.

Description

Describe your issue in detail. Include screenshots if needed.

None of the options for IOS are working.
This is working fine on Android.

I keep getting - Unrecognized font family 'Material Design Icons' on any screen loading vector icons

Demo

You can use https://snack.expo.io/ to create a demo that can help users to better understand your problem.

[mobileguru007]

Same here,

[danielhros]

same

[mexmirror]

Stumbled across the same issue. After a clean rebuild, the build system complains about multiple scripts would produce the same font files.

[mexmirror]

I could make it work after a few attempts. Since manual linking is deprecated, the CLI will print out some errors, which you must not follow, otherwise the build will break, since two scripts will attempt to write the fonts into the bundle. After cleaning the iOS project in Xcode and building it again it works with manual linking (yarn react-native link).

Edit: Check #1105 for more details, manual linking is not necessary if adding the files to the Info.plist manually. It seems to be the cleanest approach after all.

[danielhros]

Solution worked for me on RN 0.63:

Steps:

1. npm install --save react-native-vector-icons
2. cd ios & pod install
3. When importing font just add:

import Icon from 'react-native-vector-icons/MaterialIcons'
Icon.loadFont();

For Android edit android/app/build.gradle and add the following:
apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"

https://github.com/oblador/react-native-vector-icons/issues/945#issuecomment-462133721

[blugost]

I am getting a linking error on install where it wont build. Please see the description here: https://stackoverflow.com/questions/63331239/react-native-ios-build-issues-while-installing-react-native-vector-icons

[arthurpankiewicz]

Can't believe this never ending headache still exists for such a staple library

@danielhros Your solution Icon.loadFont() worked for me, thank you!!

[jonasgroendahl]

I could make it work after a few attempts. Since manual linking is deprecated, the CLI will print out some errors, which you must not follow, otherwise the build will break, since two scripts will attempt to write the fonts into the bundle. After cleaning the iOS project in Xcode and building it again it works with manual linking (yarn react-native link).

Edit: Check #1105 for more details, manual linking is not necessary if adding the files to the Info.plist manually. It seems to be the cleanest approach after all.

Yes, npm install react-native-vector-icons, pod install, open Info.plist and copy/paste icon names (from the install instructions) in there and it works. Should be in the README.

[phoffer]

@danielhros when I try your suggestion, pod install fails with

[!] No podspec found for `react-native-version-number` in `../node_modules/react-native-version-number`

I have it installed in package.json but autolinked as I'm on RN 0.63.2. Do you have any suggestions?
Trying to run react-native link react-native-version-number just takes me down a road of headache and failure.

[capc0]

@danielhros did you mange to get font awesome 5 working?

FontAwesome is working, but with 5 the method loadFont is undefined