[react-native] react-native-vector-icons 사용 시 오류 해결

error React Native CLI uses autolinking for native dependencies, but the following modules are linked manually: 
  - react-native-vector-icons (to unlink run: "react-native unlink react-native-vector-icons")
  
  ...
  
  error: Multiple commands produce '/Users/user/Library/Developer/Xcode/DerivedData/todo-amgojlyjogtbyxgotzfheqwjjnom/Build/Products/Debug-iphonesimulator/todo.app/SimpleLineIcons.ttf':
  
  ...

 

react native vector icons 를 사용하려는데... 위 오류가 계속 떴다.

프로젝트 다시 빌드하고 프로세스 끄고 클린빌드하고 재설치하고 라이브러리 수동 연결 어쩌고 저쩌고 등등.. 여러 시도를 한 끝에

드디어 해결했다................

 

ios 의 경우 pod 를 사용하여 React-native-vector-icons 를 추가해야 하는데

원래는 react-native link react-native-vector-icons 명령어를 통해 link 를 시켜줘야 한다.

하지만 react-native 0.6 버전부터 autolink 를 지원하니... link 한 것 취소하고 unlink 를 하라고 한다.

그래서 Unlink 했더니 can't find font ~ 가 뜬다 ㅋㅋㅋㅋㅋ 어쩌란거냐~

 

해결법은 이렇다.....

먼저 unlink 하라는대로 하기

react-native unlink react-native-vector-icons

 

그 다음 ios 폴더의 info.plist 에 아래 코드를 직접 수정해주면 해결된다.

나의 경우에는 ../ios/app_name/info.plist 에 있었다.

<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>MaterialCommunityIcons.ttf</string>
        <string>MaterialIcons.ttf</string>
        <string>Octicons.ttf</string>
        <string>SimpleLineIcons.ttf</string>
        <string>Zocial.ttf</string>
    </array>

 

참고로 info.plist 는 ios 의 패키지 필수 정보를 저장하는... package.json 같은 녀석이다.