맨땅에 코딩

RE:BORN Frontend - React Native 폰트 적용하기 본문

KAU 2024 (3학년)/산학프로젝트

RE:BORN Frontend - React Native 폰트 적용하기

나는 푸딩 2024. 12. 2. 21:06

RE:BORN 프로젝트에서 폰트 적용한 팀원은 다른분입니다만,,

제가 요즘 다시 React Native를 다루게 되면서 폰트 적용하는 방법을 알게 되었습니다 :)

그래서 아 그분도 이렇게 적용하셨겠구나 하면서 다른 프로젝트에 적용해보았고,

그 방법에 대해 아주 간단하게 적어보려고 합니다!

 

이 방법은 안드로이드 앱에 폰트 적용 시 해당하는 방법이니, 참고하여 봐주시면 감사하겠습니다.

 

먼저, 사용할 폰트의 .ttf 파일을 다운받고,

루트 경로에 'assets' 폴더 안에 'fonts' 폴더 안에 다운받은 .ttf 파일을 복사해서 붙여넣기 해줍니다.

 

다음으로, react-native-config.js 파일을 만든 후 아래와 같이 코드를 작성해줍니다.

module.exports = {
  project: {
    ios: {},
    android: {},
  },
  assets: ['./assets/fonts'], //.ttf 파일이 들어있는 폴더 경로
};

 

마지막으로 reload 해주거나 npm run android 를 다시 해줍니다.

 

그러면 될겁

안됩니다!

저는 안되더라구요

 

그럼 다음과 같이 명령어를 쳐주세요

npx react-native-asset

 

이젠 진짜 될겁니다!

 

그럼 안녕 :)