[React Native] 응용 프로그램이 예기치 않게 종료되었습니다. (Library not loaded: @rpath/hermes.framework/hermes)
2022. 11. 13. 12:22
Front-end/App
내 개인 맥북(19년 intel pro)으로 RN을 돌렸던 프로젝트 버전이 0.67이었고, 최근에 프로젝트가 생겨 0.70에 맞게 공식문서와 내 환경설정에 비교한 뒤 구동을 해보았다. 위 사진과 같이 되는 듯 싶었으나... 이런 식으로 네이티브 단에서 크러쉬 리포트를 뿜어내며 앱이 튕긴다. Termination Reason를 보면 어떤 사유로 일어났는지 잘 보여준다. 나같은 경우는 hermes 관련 에러가 일어났는데, Podfile을 보면... 관련 설정이 되어있고, 주석으로 설명되어있다. true를 false로 바꿔주고 다시 pod install 후 빌드하면 잘 된다! 추가로 크러쉬 리포트는 네이티브단 설정이 충돌이 나면서 발생하므로, 네이티브 설정을 중점적으로 확인하자. Xcode을 변경하였을 경우에..
[React Native] TextInput 패스워드 폼 적용하기
2022. 11. 7. 20:48
Front-end/App
웹에는 input type="password" 으로 타입에 있는 목록에 찾으면 됩니다. 그러나 RN은 type을 제공하지 않아 당황하여 찾고 있지만 공식문서 읽는 것이 힘들거나 구글링을 하고 있는 코더들과 맨날 까먹는 스스로를 위해 기록합니다. secureTextEntry를 집어넣으면 됩니다.. boolean값이라 그냥 넣으면 true로 적용이 됩니다. https://reactnative.dev/docs/textinput#securetextentry TextInput · React Native A foundational component for inputting text into the app via a keyboard. Props provide configurability for several feat..
react-native-config로 .env 환경변수 설정하기
2022. 10. 26. 19:50
Front-end/App
환경변수를 관리하기 위해 .env를 적용할 수 있게 하는 라이브러리입니다. React와는 다르게 .env를 생성하고 네이티브단과 연동하는 작업이 필요합니다. 그 연동하는 것을 도와주는 라이브러리라고 생각하면 됩니다. 라이브러리 설치 yarn add react-native-config npx pod-install ios iOS // AppDelegate.mm 에서 해당 구문 추가 #import Android // setting.gradle 에서 해당 구문 추가 include ':react-native-config' project(':react-native-config').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-..
[React Native] React Native 버전 변경하는 법(Upgrade or Degrade)
2022. 8. 5. 13:50
Front-end/App
RN은 어쩔 수 없이 오픈 소스 라이브러리에 의존이 심하다보니 버전 충돌 이슈를 자주 겪는다. 지양하는 편이 좋지만 기존 프로젝트의 RN 버전 자체를 변경하고 싶은 경우엔 어떻게 할까? React Native Upgrade Helper라는 웹 툴을 이용하자 https://react-native-community.github.io/upgrade-helper/ Upgrade React Native applications react-native-community.github.io 업그레이드 하기 위해서는 좌측에는 현재 버전, 우측에는 바뀔 버전을 선택하고 파란색 버튼을 클릭한다. 그러면 아래 깃 포맷으로 바꿔야하는 부분들을 파일별로 정리를 해준다. 그대로 바꿔주면 되는데, 당연히 버전 차이가 많이 날수록 바꿔..
[React Native] Invariant Violation: "projectname" has not been registered. This can happen if:* Metro (the local dev server) is run from the wrong folder. Check if Metro is running, stop it and restart it in the current project.* A module failed to load..
2022. 8. 4. 17:33
Front-end/App
잘만 되던 프로젝트를 다시 Android로 실행하면 다음과 같이 에러가 뜰 때가 있다. 코드는 건든게 없고.. 프로젝트를 삭제하고 ./gradlew clean으로 캐쉬를 비워주어도 해결이 되지 않았다. 연유는 모르겠으나 RN 프로젝트 가끔 뻑이 나는 경우 사용하는 4가지 방법 중 하나인 맥을 리부팅 해보았더니 정상적으로 해결이 되었다.. (4가지 방법 = npm reinstall, 네이티브단 캐쉬 삭제, 프로젝트 삭제 후 재설치, PC 리부팅) Invariant Violation: "projectname" has not been registered. This can happen if:* Metro (the local dev server) is run from the wrong folder. Check i..
[React Native] Guideline 5.1.1 - Legal - Privacy - Data Collection and Storage. reject 이슈
2022. 7. 30. 19:14
Front-end/App
Guideline 5.1.1 - Legal - Privacy - Data Collection and Storage We noticed that your app requests the user’s consent to access the contacts, but doesn’t sufficiently explain the use of the contacts in the purpose string. contactsTo help users make informed decisions about how their data is used, all permission request alerts need to explain how your app will use the requested information. To hel..
[React Native] 안드로이드 릴리즈 버전일 때 튕기는 경우(react-native-svg 라이브러리 적용 확인)
2022. 7. 30. 18:35
Front-end/App
RN단에서도 디버그버전에서도 잘 되는데, 릴리즈 버전에서 svg을 사용한 화면으로 네이게이트하면 곧바로 튕기는 경우가 있다.(에러 구문은 기억이 안남) 이 경우 react-native-svg 라이브러리를 이용하여 svg를 사용하고 아래 설정을 해놓지 않아서 그렇다. android/app/proguard-rules.pro 해당 경로로 들어가 아래 구문을 추가해주고 저장하면 된다. -keep public class com.horcrux.svg.** {*;} 출처는 교과서에.. https://github.com/react-native-svg/react-native-svg#problems-with-proguard GitHub - react-native-svg/react-native-svg: SVG library..
[React Native] Android Studio에서 안드로이드 에뮬레이터 직접 실행 시 업데이트가 안될 때
2022. 7. 30. 18:15
Front-end/App
"react-native run-android" 혹은 "react-native run-ios"을 통해 에뮬레이터를 실행하는 것이 간편하지만, 결국 릴리즈 버전을 체크하려면 네이티브단에서 실행하는 화면 단을 봐야합니다. 인텔리제이(네이티브 안드로이드 IDE) 에서 에뮬레이터 실행 시 최근에 짠 코드로 업데이트가 되지 않은 상태로 띄워질 때가 있습니다. 원인은 RN단에서 작성된 코드가 index.android.bundle 파일로 인코딩이 되지 않은 경우로 보이는데, 터미널에서 아래 명령어를 입력하여 index.android.bundle을 현재 버전으로 업데이트 시켜주면 해결이 됩니다. react-native bundle --platform android --dev false --entry-file index..