Google Fonts in React Native
check the documentation here -> https://github.com/expo/google-fonts
Start: type this into your terminal to install the expo font package
expo install expo-font
then type this command
expo install @expo-google-fonts/your-font
replace your-font with the font you want to install, like in the example below:
expo install @expo-google-fonts/lato
then add in your (for example) app.js the following code. Also check the Comments in the Code :)
// import oswald font
import {
useFonts as useOswald,
Oswald_400Regular,
} from "@expo-google-fonts/oswald";
// import lato font
import { useFonts as useLato, Lato_400Regular } from "@expo-google-fonts/lato";
export default function App() {
// useFont Hook
const [oswaldLoaded] = useOswald({
// load any font variation in here
Oswald_400Regular,
});
const [latoLoaded] = useLato({
Lato_400Regular,
});
// check if they are there
if (!oswaldLoaded || !latoLoaded) {
return null;
}
if you have any questions, feel free to ask ππ»
Top comments (1)
how can we use the same font on the entire app without importing it each time on every component ?