DEV Community

Discussion on: Using custom fonts in react native

View post
Collapse
 
jqn profile image
Joaquin Guardado • • Edited

Awesome tutorial! Thank you Kenneth. I just wanted to add that this produces a conflict with react-native-vector-icons. If you get the following error when building for ios, just run npx react-native unlink react-native-vector-icons to solve it. Also note you may have to add the UIAppFonts from react-native-vector-icons back to the info.plist

        <key>UIAppFonts</key>
        <array>
            <string>AntDesign.ttf</string>
            <string>Entypo.ttf</string>
            <string>EvilIcons.ttf</string>
            <string>Feather.ttf</string>
            <string>FontAwesome.ttf</string>
            <string>FontAwesome5_Brands.ttf</string>
            <string>FontAwesome5_Regular.ttf</string>
            <string>FontAwesome5_Solid.ttf</string>
            <string>Foundation.ttf</string>
            <string>Ionicons.ttf</string>
            <string>MaterialIcons.ttf</string>
            <string>MaterialCommunityIcons.ttf</string>
            <string>SimpleLineIcons.ttf</string>
            <string>Octicons.ttf</string>
            <string>Zocial.ttf</string>
            <string>Fontisto.ttf</string>
            <string>Audiowide-Regular.ttf</string>
        </array>
Enter fullscreen mode Exit fullscreen mode

Error:

Multiple commands produce '/Users/../Library/Developer/Xcode/DerivedData/Sunny-cizcwsftlezikbexcuktuopmsmge/Build/Products/Debug-iphonesimulator/Sunny.app/Zocial.ttf':
...
Enter fullscreen mode Exit fullscreen mode

Also run npx pod-install to link react-native-vector-icons` again.

Collapse
 
dsantacruz profile image
Diego Santa Cruz •

This worked for me, thanks