By Vishal Basumatary in javascript — Mar 24, 2023

Unrecognised font family React native vector icon

If you are facing the error message "Unrecognised font family React native vector icon" while using React Native Vector Icons in your project, it means that the required font files for the icons are not being properly processed or loaded.

There are several reasons why this error might occur, including:

Incorrect installation or setup of the React Native Vector Icons library
Missing or incorrect font file references in your project
Issues with the local font cache or device font cache

To resolve this issue, you can try the following solutions:

1. Reinstall React Native Vector Icons

If the library was not installed correctly, you may need to reinstall it. This can be done using the following command:

npm install react-native-vector-icons

Make sure to also link the library using the following command:

react-native link react-native-vector-icons

2. Check Font File References

Make sure all font files are referenced correctly in your project. You can check this by navigating to the location of the icons in your project and ensuring that the font files are present and referenced correctly in your code.

3. Clear Device Font Cache

Sometimes issues can arise with device font caches. To clear the cache on iOS, navigate to Settings → General → Reset → Reset All Settings. On Android, navigate to Settings → Apps → System Apps → Fonts → Storage → Clear Data.

If none of the above solutions work, you can try using a different icon library or creating your own custom font file for your icons.