Problem when rendering Open-sans font in React Native V 60+ - react-native

Question

i want to add 'Open-sans' font to my App but i have an issue and it happens on IOS simulator only
here is my steps :
a) I've created a folder in root app as : assets then fonts fonts folder in assets and put Open-sans.ttf
b) I've made a file in root with the name react-native-config.js and add:
module.exports = {
project: {
ios: {},
android: {},
},
assets: ['./assets/fonts/'],
};
c) react-native link
d) In the App.js
<Text style={{fontFamily: 'OpenSans-Bold', fontWeight: 'bold'}}>
This is my first App
</Text>
My problem is it keeps telling me `Unrecognized font family' whenever i made any edit in the App.js
but when i open react-native-config.js and do nothing but save only the hot reload fired and the font is working
as i mentioned it's perfect on Android but the error appears on IOS when save after any edit on App.js file

Answer 1

For IOS the font-family value is fullname and for android its file name.
Try:
<Text style={{fontFamily: 'Open Sans Bold'}}>This is my first App</Text>
For Android, change the file name 'OpenSans-Bold.ttf' to 'Open Sans Bold.ttf'

Answer 2

I was with the same error, so thats what I did:
1 - Rename react-native-config.js to react-native.config.js and put this script on file:
module.exports = {
assets: ['./src/assets/fonts'], // this is my path
};
2 - put it on my package.json :
rnpm": {
"ios": {},
"android": {},
"assets": [
"./src/assets/font"// this is my path
]
},
and After I run react-native link && yarn react-native link.
Check if your info-plist and your android assets are changed

Answer 3

As per your description you have only put Open-sans.ttf in asset folder. But you are trying to access OpenSans-Bold which is not added to your asset folder. To get access to any particular font, you need to add that one to the asset folder. Here is an example for your referrence...
you can check this too for better understanding