Unrecognized font family error in React Native 60

Question

here's a screenshot for the error

react-native.config.js file

module.exports = {
    project: {
        ios: {},
        android: {},
    },
    assets: ["./assets/fonts"]
};

I tried to work directly through XCode , but the same

the font inside resources folder and also in Copy Bundle resources

it's also exist in Info.plist in Fonts provided by application

I confirmed on everything many times , but always fire this error

Answer 1

if React Native Version < 0.60 You need to tell react native where our custom fonts are located . Adding the following lines in your package.json

If React Native Version ≥ 0.60 (Detail) Create File “react-native.config.js” and add following code

Answer 2

Follow these simple steps to add custom fonts to your app

1. add all the font files you want to an assets/fonts folder in the root of your react-native project

   

2. For React-Native Version < 0.60 we need to tell the react-native where our custom fonts are located. We do this by adding rnpm to package.json providing the path to the font files

   "rnpm": { "assets": [ "./assets/fonts/" ] },

   For React-Native Version > 0.60 we need to create a file "react-native.config.js" and add

   module.exports = { project: { ios: {}, android: {} }, assets: ['./assets/fonts/'] };

3. If npm version > 5 run this command npx react-native link
   If npm version < 5 run this command react-native link

This should add the font references in your Info.plist file for iOS and on Android copy the font files to android/app/src/main/assets/fonts. You can verify this by opening up Info.plist from the iOS folder and looking for a UIAppFonts key