nextjs,tailwindcss,vercel

expo router 프로젝트 커스텀 폰트 적용하기

주영 🐱 2024. 11. 19. 11:02
728x90
반응형

1. 폰트 파일 .ttf 를 프로젝트 assets/fonts/에 저장한다. 

2. 다음 을 설치한다. 

npx expo install expo-font

 

3. app.json에 다음을 추가

[
  "expo-font",
  { useEffect(() => {
    const loadFonts = async () => {
      await Font.loadAsync({
        'pixel': require('@/assets/fonts/pixel.ttf'),
      });
      setFontsLoaded(true);
    };

    loadFonts();
  }, []);    "fonts": ["./assets/fonts/pixel.ttf"]
  }
]

 

사용 시 

 

 

참고

https://docs.expo.dev/develop/user-interface/fonts/

반응형