The recommended way is to create your own component, such as MyAppText. MyAppText would be a simple component that renders a Text component using your universal style and can pass through other props, etc.
https://reactnative.dev/docs/text#limited-style-inheritance
Answer from David E. Chen on Stack OverflowVideos
The recommended way is to create your own component, such as MyAppText. MyAppText would be a simple component that renders a Text component using your universal style and can pass through other props, etc.
https://reactnative.dev/docs/text#limited-style-inheritance
There was recently a node module that was made that solves this problem so you don't have to create another component.
https://github.com/Ajackster/react-native-global-props
https://www.npmjs.com/package/react-native-global-props
The documentation states that in your highest order component, import the setCustomText function like so.
import { setCustomText } from 'react-native-global-props';
Then, create the custom styling/props you want for the react-native Text component. In your case, you'd like fontFamily to work on every Text component.
const customTextProps = {
style: {
fontFamily: yourFont
}
}
Call the setCustomText function and pass your props/styles into the function.
setCustomText(customTextProps);
And then all react-native Text components will have your declared fontFamily along with any other props/styles you provide.
» npm install react-native-vector-icons
UPDATE
Many answers are here for adding custom font in react-native for version < 0.60.
For those who are using react-native version > 0.60 , 'rnpm' is deprecated and custom fonts will not work.
Now, in order to add custom font in react-native version > 0.60 you will have to :
1- Create a file named react-native.config.js in the root folder of your project.
2- add this in that new file
module.exports = {
project: {
ios: {},
android: {},
},
assets: ['./assets/fonts']
};
For those running on react-native version < 0.69.x
3- run react-native link command in the root project path.
PS Make sure you have the right path for the fonts folder before running react-native link command
For those running on react-native version >= 0.69.x, Since link is deprecated so react-native link will not work anymore,
the command react-native link is replaced by npx react-native-asset.
More info about the release can be seen here: https://github.com/react-native-community/cli/releases/tag/v8.0.0
- Add your fonts file in
Project folder/android/app/src/main/assets/fonts/font_name.ttf
- Restart the package manager using
react-native run-android - Then you can use your font in your style e.g
fontFamily: 'font_name'