npx react-native link dose not working for me

Question

I'm trying to use this (https://mehrankhandev.medium.com/ultimate-guide-to-use-custom-fonts-in-react-native-77fcdf859cf4) to add font but I have problem with this part...

npx react-native link

this command don't shows anything to me... anything; and then console line "C:\Users****\WebstormProjects\myFirstProject> appears again. like I didn't wrote any command at first. what's wrong?

Answer 1

You need to create a react-native.config.js then you can use react-native link command.

Example:

module.exports = {
    project: {
        ios: {},
        android: {},
    },
    assets: ['./src/assets/fonts/Montserrat', './src/assets/fonts/Nunito', './src/assets/fonts/Newsreader', './src/assets/fonts/Anton', './src/assets/fonts/Gilroy'],
};

Answer 2

I think, 'link' has been removed in v0.69. Here are the steps to add custom fonts.

1. Copy the font files to "./assets/fonts" folder.

2. Add the react-native.config.js file to project root with the code bellow

   module.exports = {
   assets:['./assets/fonts']}
   

3. For android no need to link but in the ios additionally follow the below steps.

   Open the ios project in Xcode. Drag and drop font files on to "Copy Bundle Resources".

Then open the "Info.plist" and add the fonts.

After that goto "Product" menu and hit the "Clean Build Folder". Then start the Metro and start your application.

Answer 3

Use npx react-native-asset for react-native > 0.69

Answer 4

in RN +0.69 some times when you are trying to add your custom fonts, you may saw this error :

'react-native-asset' is not recognized as an internal or external command

If you get this error first install yarn add -D react-native-asset as a dev dependency then run npx react-native-asset