Search
 
SCRIPT & CODE EXAMPLE
 
CODE EXAMPLE FOR SHELL

expo font

// How to add custom fonts to react native expo project
// 1 put your font.ttf file in: yourProjectFolder/assets/fonts/FontFile.ttf

// 2 Add this import
import { useFonts } from 'expo-font';

// 3 Add this hook to your component:
    const [loaded] = useFonts({   // make sure path is correct
        MyFontName: require('../assets/fonts/FontFile.ttf'),
    });   

// 4 then use it in your style sheet like this:
const styles = StyleSheet.create({
    myText:{
        fontFamily: 'MyFontName',
    },
});
// hope it helped :)

// IF THIS DOESNT WORK, TRY THIS
// 1 create "react-native.config.js" file in your project folder
// 2 copy this code to the file:
module.exports = {
    assets: ['./assets/fonts'],
};
// 3 open new terminal, and run (React >= 0.6.9):
npx react-native-asset
// or for older react-native versions: 
npx react-native link
// 4 now restart your expo app and it should work
Source by docs.expo.dev #
 
PREVIOUS NEXT
Tagged: #expo #font
ADD COMMENT
Topic
Name
7+8 =