[React Native] 'react-native-vector-icons' 사용해서 아이콘 출력하기

🚨 아이콘 출력 오류

원하는 아이콘이 제대로 출력되지 않고 물음표(?)로 뜨고, 콘솔창에 오류 메시지가 출력됨 

---

🔎 해결 방안

* 안드로이드 기준입니다!

 

1) android/app/main/asseets/fonts 폴더 생성

 

2) node_modules 아래에 있는 모든 ttf 파일을 1번에 생성한 폴더 아래로 이동한다 

→ 나의 경우 1,2번 과정을 하지 않아 아이콘이 제대로 출력되지 않았음

* 1번 사진 참고

 

3) 아래 사이트에서 원하는 아이콘 선택

https://oblador.github.io/react-native-vector-icons/

react-native-vector-icons directory

 

4) 리액트 네이티브 프로젝트에 아래 코드 추가

 

ex. AntDesign의 search1 아이콘을 추가하고자 할 때

 

import AntDesign from "react-native-vector-icons/AntDesign";

<AntDesign name="search1" size={20} color="black" />