question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

React Native fonts don`t work

See original GitHub issue

react-native info: System: OS: macOS 10.15.6 CPU: (2) x64 Intel® Core™2 Duo CPU P8600 @ 2.40GHz Memory: 59.32 MB / 8.00 GB Shell: 5.7.1 - /bin/zsh Binaries: Node: 12.16.1 - /usr/local/bin/node Yarn: Not Found npm: 6.14.8 - /usr/local/bin/npm Watchman: Not Found Managers: CocoaPods: 1.9.3 - /usr/local/bin/pod SDKs: iOS SDK: Platforms: iOS 14.1, DriverKit 19.0, macOS 10.15, tvOS 14.0, watchOS 7.0 Android SDK: Not Found IDEs: Android Studio: Not Found Xcode: 12.1/12A7403 - /usr/bin/xcodebuild Languages: Java: Not Found Python: 2.7.16 - /usr/bin/python npmPackages: @react-native-community/cli: Not Found react: 16.13.1 => 16.13.1 react-native: 0.63.3 => 0.63.3 npmGlobalPackages: react-native: Not Found

Steps:

  1. Download any font family

  2. Create react-native.config.js

  3. Insert there module.exports = { assets: ['./src/fonts'] }

  4. run react-native link

  5. Get success message: info Linking assets to ios project info Linking assets to android project success Assets have been successfully linked to your project

  6. react-native run-ios (iOS v: 13.1 && iphone 8)

  7. Get this error => https://ibb.co/TYYXV4G - Unrecognized Font Family ‘Montserrat Family’

Issue Analytics

  • State:open
  • Created 3 years ago
  • Comments:7

github_iconTop GitHub Comments

1reaction
yahm23commented, Nov 25, 2020

Have you checked the font in Font-book’s name? Font names on iOS devices are sometimes not the same as the file name. Open the font in font-book and use the PostScript’s name instead of the file name.

From #25852

1reaction
chrisgleincommented, Nov 17, 2020

Can you provide more info on your repro? There’s no detail of how you’re referring to the font. A link to a repo with a minimized repro would help. The set of steps you’re following at a glance sound the same as say this guide, but there may be some difference.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Custom font not working in React Native
Add your fonts to the yourproject/assets folder. · Then add "rnpm": {"assets": ["./assets/fonts/"]} to your package.json file. · Run react-native ...
Read more >
Custom fonts not working on React-Native 0.62 #28448
I'm trying to use a custom font on my app but it doesn't work. I have followed numerous steps from other similar questions...
Read more >
Blog: Fix Custom Font Inconsistency in React Native
If your fonts are still slightly off, try setting includeFontPadding to false and textAlignVertical to 'center' in your font styles. The ...
Read more >
How to add custom fonts in React Native
Adding fonts the React Native way (0.60+) · Get the fonts required for the app · Add the configuration to the project ·...
Read more >
Ultimate guide to use custom fonts in react native
Step 2 : Add Fonts to Assets · Step 3 : Define assets directory · Step 4 : Link assets using react native...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found