React Native Unrecognized font family 에러 해결하기

에러 발생

react-native를 처음에 시작하고 나서 가장 당황스러웠던 에러고, 처음에 잘 모르는데 고생을 너무 했다.  react-native-vector-icons 를 설치하고 나서 아이콘의 이미지가 나타나지 않았을 때 이 유형의 에러를 처음 보게 되었는데, 이미지나 아이콘을 불러올 때는 공통적으로 유사한 에러가 발생한다.

 

 

에러 해결

VScode와 같은 에디터에서 ios 폴더 > [프로젝트명] 폴더 > Info.plist 파일을 연다. 

<dict> </dict> 내부에 아래와 같은 내용을 <key>와 <array>를 붙여넣기 한 이후 저장한다.

<dict>
  	<key>UIAppFonts</key>
	<array>
		<string>AntDesign.ttf</string>
		<string>Entypo.ttf</string>
		<string>EvilIcons.ttf</string>
		<string>Feather.ttf</string>
		<string>FontAwesome.ttf</string>
		<string>FontAwesome5_Brands.ttf</string>
		<string>FontAwesome5_Regular.ttf</string>
		<string>FontAwesome5_Solid.ttf</string>
		<string>Foundation.ttf</string>
		<string>Ionicons.ttf</string>
		<string>MaterialIcons.ttf</string>
		<string>MaterialCommunityIcons.ttf</string>
		<string>SimpleLineIcons.ttf</string>
		<string>Octicons.ttf</string>
		<string>Zocial.ttf</string>
	</array>
</dict>

 

pod install을 까먹지 말자

cd ios
pod install
cd ..
npm run ios