선생님 개발블로그가 하고싶어요.

만들어야되는 상황이 발생

package.json의 scripts항목에 넣어주고

"scripts": {

    "build:ios": "react-native bundle --entry-file='index.js' --bundle-output='./ios/main.jsbundle' --dev=false --platform='ios'",

..........

}

yarn build:ios 로 실행 

리액트 네이티브를 공부하던중 제목과 같은 오류를 만났다.

네비게이션스택을 구성하는 예제였으나 코드상에 문제는 보이지 않았다.

문제는 기본 라이브러리가 제대로 설치가 되지 않았던거였다.

https://stackoverflow.com/questions/66921263/invariant-violation-requirenativecomponent-rnsscreen-was-not-found-in-the-ui

해당 문제에 대한 스택 오버플로우 질문과 답변이다.

아래는 해당 문제를 해결하기위해 프로젝트 루트폴더에서 실행한 명령어다.

npm install @react-navigation/native

npm install react-native-reanimated react-native-gesture-handler react-native-screens react-native-safe-area-context @react-native-community/masked-view

npx pod-install ios

react-native run-ios

react-native run-ios

를 입력하면 기본지정 실행

--device '디바이스이름' 파라미터를 넣으면 실기기 테스트 // 디바이스로 실행하는건 테스트를 안해봤습니다.

--simulator="시뮬레이터 이름" 파라미터를 넣으면 해당 시뮬레이터로 테스트

ex)

\iphone 12 시뮬레이터로 실행

react-native run-ios --simulator="iPhone 12"

이번 rn으로된 프로젝트에 ios용 타겟추가해주는 팀에서 일하는중 

rn앱을 시뮬로 돌리려면 항상 어디선가 문제가 발생하고 고치느랴 오전 ~ 점심시간이 다 날라갔다.

이번에도 역시 안되다가 모든 pod파일과 빌드파일들을 삭제하고 이참에 업데이트 까지 해놨더니

이번엔 이상한 오류가 발생

event2/event-config.h  file not found 라며 안된다. 

찾아보니 이는 flipper 라는 묘한녀석의 버전이 안맞아 생기는 문제라고하는데....

cocoapods의 버전을 업데이트한게 문제가 된것으로 보인다.

당연히 자동으로 버전관리를 하기에 버전의 번호가 안적힌상태였는데 

이를 아래와같이 변경해주면 무사히 빌드가 됐다.

Podfile 중

use_flipper!

를

use_flipper!({ 'Flipper-Folly' => '2.3.0' })

로

항상 도움을 주는 스택오버플로우 여러분께 감사인사를 드린다.

stackoverflow.com/questions/66019068/event2-event-config-h-file-not-found

내가 효과가 있던 방법.

KalebPortillo commented on 24 Aug 2019

MetroHMRClient 주소를 위처럼 변경 해주거나

원본인 require('metro/src/lib/bundle-modules/HMRClient'); 으로 바꿔보기

일단 검색으로 한글 페이지로도 나오는 해결방법은

다음과같다

rm -rf ios/build

한후

react-native run-ios

다음은 내가 해결한 방법

해당 부분은 appdelegate.m이다.

디버그 부분을 위아래 전부다 해보자

- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge

{

#if DEBUG

  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil];

//  return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];

#else

  return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];

#endif

}

도대체 뭐가 뭔지....

두번째 방법은 기존 index로 되어있는게 안되서 아래 릴리즈버전과 동일시로 변경해줬던거 같은데 이번엔 다르게 해줘야 또 들어간다

뭐가 변경된건지 감도 안잡힌다

자바스크림트는 다뤄본적도 없는 내가 하이브리드 앱을 위해 리액트 네이티브를 공부하기 시작했습니다.

공부하던 도중 자주보이는 이 연산자 ...

말줄임표 같이 생긴 이 점세개에 무슨의미가 있길래 이리도 자주 쓰이나 궁굼증만 넘쳐나고 있었습니다.

제목 그대로의 스택오버플로우의 답변에는 

https://stackoverflow.com/questions/40124680/what-does-in-react-native-mean

-답변

이건 스프레드 구문이라 부른다!

연속되는 배열이나 여러 요소가 담긴 녀석을 사용해 확장시킬때 써!

--

라고 하는데 도저히 잘 감이 안잡힌다.

예시를 볼때는 오로지 전부 배열뿐인데 

배열에서만 사용되는거면 이해가 되긴하는데..

내가 보는 튜토리얼 강좌에는 

플랫폼 선택에 따라 다른 설정을 해줄때 아래의 함수를 쓴다

...Platform.select()

그놈의 점세개...

...

...

아직도 이 점세개의 의미가 잘 파악되지않는다.