CODEWITHSUNDEEP
react-nativereact-native-maps
E Pierre
E Pierre

Reputation: 426

A way to only link fonts react native

I am working with react native and I only want to link my fonts and nothing else.

I am using react-native-maps and it specifically says in the docs "Do not use react-native link"

Everywhere I look I see that people say to do react-native link in order to link fonts but I am wonder in if there is proper syntax for just linking fonts like:

react-native link ./assets/fonts or something? That way it will not also link all my other libraries

Upvotes: 21

Views: 33994

Answers (7)

MohammadAkil Chaklawala
MohammadAkil Chaklawala

Reputation: 39

STEP - 1: Create react-native.config.js file in the root folder

STEP - 2: Add this code to this file

module.exports = {
        project: {
        ios:{},
        android:{}
          },
        assets:['./assets/fonts/'], <--- add the path where fonts are added it should start from the root path 
    }

STEP - 3: React-native version < 0.69

Run the npx react-native link command

React-native version > 0.69

Run npx react-native-asset command

Upvotes: 0

amir behrouzi
amir behrouzi

Reputation: 155

some times you have writed react-native.config.js correctlly in such cases ; if you do this tasks it helps you

1- delete react-native.config.js file

2- create this file with same code again

3- write react-native link in console

then you can see resources folder in Xcode and you can see your fonts in info.plist and copy bundle resources

Upvotes: 1

Akshay I
Akshay I

Reputation: 4185

if React Native Version ≥ 0.60

Create File react-native.config.js in the project root and add the following code

module.exports = {
  project: {
    ios: {},
    android: {}
  },
  assets: ["./assets/fonts/"]
};

and Run command : react-native link or npx react-native link

Upvotes: 7

E Pierre
E Pierre

Reputation: 426

I'm just going to link them manually. This is a really strange requirement for react-native-maps though. Almost everything in react-native that is a individual library needs linking.

If anyone else has a better answer please let me know.

https://medium.com/@kswanie21/custom-fonts-in-react-native-tutorial-for-ios-android-76ceeaa0eb78

^ I know stack overflow does not like links but there are a lot of steps and images.

EDIT

Cool thing, if you do react-native link <specific-library-name-here> then react-native will first link your assets and then link that specific library. So if you ever just want to link your fonts you can do that by linking some specific library along with it.

EDIT 2

If you just want to link your assets folder, try react-native link "package-that-does-not-exist", it will still link your assets without linking anything else.

Upvotes: 10

Vikas Gupta
Vikas Gupta

Reputation: 1231

While Marek Lisik answer didn't worked for me and I also didn't want to use a third party library for such small task. So, I solved it manually by copying fonts file in follwing folder for android development.

your_app\android\app\src\main\assets\fonts

For ios, you can also follow E Pierre answer.

Upvotes: 0

danoszz
danoszz

Reputation: 403

There is a suitable package called react-native-assets, which links & unlinks only the assets. Saved me some time manually linking.

https://www.npmjs.com/package/react-native-asset

Upvotes: 10

Marek Lisik
Marek Lisik

Reputation: 2185

You can give react-native link a parameter / name that is not present in your package.json - this will cause the task list for the command to contain only the link assets task.

So react-native link ./assets/fonts is not a valid command, but it should work.

Do remember you need your fonts dir specified in package.json as per Hamed's answer.

Upvotes: 14

Related Questions