CODEWITHSUNDEEP
reactjsreact-native
Stanislau Buzunko
Stanislau Buzunko

Reputation: 1811

Unrecognized font family on ios react-native > 0.60

I've faced this error using react-native 0.61.3-0.61.5, maybe older or newer versions don't have this bug.

Here is recommended way that didn't work for me.

1) I've placed fonts in src/assets/fonts folder

2) specified path to fonts folder in react-native.config.js -> assets: ["./src/assets/fonts/"]

3) tried running both react-native link and npx react-native link

Upvotes: 2

Views: 11848

Answers (2)

Gaurav Roy
Gaurav Roy

Reputation: 12210

This is the docs from where ive integrated custom fonts in my react native app. Very tedious work but yes, in ios there are more steps. Please find link which explains beautifuly. rn- custom-fonts

This is the step what you did :

enter image description here

Upvotes: 1

Stanislau Buzunko
Stanislau Buzunko

Reputation: 1811

After spending about two hours I've found a workaround for iOS. It's not nice and I recommend it only after trying official way I described in question. If it didn't work, here is a workaround I used.

  1. place fonts in your project if you haven't done it already
  2. open info.plist with your editor and look for <key>UIAppFonts</key>, if not found add
  <key>UIAppFonts</key>
  <array>
    <string>name_of_your_font.ttf</string>
    ...
  </array>
  1. place all your fonts and save
  2. open Xcode -> your project -> Build phases -> Copy bundle Resources
  3. Click on "+" and select Add other -> select your fonts and click Add

Re-run the project and it works. Final note, on iOS you must specify name of font not filename.

Have a nice day!

Upvotes: 6

Related Questions