React Native 버전과 TypeScript 동시에 다운그레이드하여 프로젝트 만들기

회사에서 리액트 네이티브로 프로젝트를 만드는데...

프로젝트 구조부터 만들어야 해서 버전 선택과 타입스크립트 사용 여부 등 모든 것을 처음부터 결정해야 했다.

우리 부서에서 구축된 개발 환경은 아래와 같다. (최신버전..)

✅ 우리부서 ✅
react : 18.0.0
react-native : 0.69.1
typescript 사용예정 O

 

다른 부서는 어떻게 하고있는지 궁금해서

다른 부서 선임 개발자분들의 자문을 구한 현재 개발 환경은 아래와 같았다.

사용 이유는 0.68 버전이 현재로서 그나마 안정적이고, 0.69 버전은 너무 최신이라 호환성와 안정성이 떨어져 선택하지 않으셨다고 한다.

👨🏻‍🏫 타부서 👨🏻‍🏫
react : 17.0.2
react-native : 0.68.2
typescript 사용 X

 

그래서 react, react native 버전은 다른 부서를 따르기로 했고, 팀 내부적으로 typescript를 사용하자는 의견이 있어 사용하기로 했다.

그럼 일단 react와 react native의 다운그레이드(downgrade)가 필요한 상황.

그래서 React 18.0.1에서 17.0.2로, RN 0.69.1에서 0.68.2 버전으로 바꾸려고 package.json 파일을 수정하고 모듈 삭제와 yarn install 을 수없이 반복했으나

typescript 버전과 꼬이며 각종 오류와 빌드 실패가 일어나는 듯 했다 ... ㅠ (App.tsx 에서 컴포넌트들을 인식을 못하는 등의 문제 )

react native 버전과 typescript 템플릿 버전 호환에 문제가 있는 것 같다는 생각은 들었으나... 어떻게 해결하는지 모르겠던 와중!!!!!!!

삽질 오지게 하고 집에와서 마지막으로 해보자..싶어서 해본 방법인데 성공! 기무띵 ㅎㅎㅎㅎㅎㅎ

 

 

react native 다운그레이드 + typescript 적용하기

TypeScript Github 에 들어가면 react native 버전과 호환되는 typescript 템플릿 버전을 명시해놓았다. (이걸 왜 이제야 봤어 ,,)

리액트 네이티브와 상응하는 타입스크립트 버전

나는 RN 0.68.2 버전을 사용할 것이기 때문에 typescript 6.10.4 버전으로 설치했다.

* 참고로, 6.10.* 이렇게 되어있는데 자세한 버전정보는 깃헙 오른쪽 release note에서 출시버전을 확인할 수 있다.

프로젝트 생성하기

$ npx react-native init MyApp --template react-native-template-typescript@6.10.4

다른거 할필요 없다. 그냥 프로젝트 생성할 때 typescript 템플릿을 원하는 버전으로 설치해주기만 하면 된다.

프로젝트를 열어 package.json 을 확인해보면 버전이 변경된 것을 확인할 수 있다.

 

앱 빌드도 잘 돌아감 ㅎㅎ 

 

 

히히 기분 좋다!

사실 해결하고 보니 별 어려운 문제가 아니었는데 리액트 네이티브를 접한지 얼마 되지 않아서 많이 삽질한것같다.

몸 컨디션도 많이 안좋고 힘들었는데 자기전에 해결해서 좋다.

 

 

도움이 되셨다면 좋아요나 댓글 달아주세요!

감사합니다.