블로그 이름을 입력해주세요

React Native cli 0.71 => 0.76 버전 업그레이드 기도 메타 본문

React-Native

React Native cli 0.71 => 0.76 버전 업그레이드 기도 메타

Dev_jihoon8730 2025. 7. 11. 23:46

 

"앱이 Android 15(API 수준 35) 이상을 타겟팅해야 함"

 

시작하면서

이번에 많은 앱개발자들이 작년부터 변경된 구글의 api 보안 정책 때문에 버전을 강제 업데이트 하고 있다

만약 업데이트를 기한 내에 하지 않으면 앱 출시가 중단되고 구글 플레이 스토어에서 사라지게 된다

 

나 또한 마찬가지로 이번에 미루고 있던 버전 업데이트를 최신 버전으로 적용시키게 되었다

여기서 말하는 api 수준 35는 안드로이드에 해당하는 컴파일 sdk 버전을 35 이상으로 올려야 한다는 말인데 리액트 네이티브에서 sdk를 35 이상으로 올리려면 필수적으로 리액트 네이티브의 버전을 같이 업그레이드시켜 줘야 버전 업데이트가 가능하다

시작 전 선행작업

1. 레거시 코드 청산

오래된 코드일수록 새로운 아키텍처를 적용한 로직으로 적용해 주거나 사용하지 않는 다면 주석이 아닌 과감하게 삭제를 하는 편이 좋다 앞으로도 사용하지 않을 확률이 높고 이후 업데이트를 진행할 때  트러블슈팅 확률을 낮추는데 도움이 된다

 

2. 사용하지 않는 종속성(라이브러리) 제거

프로젝트의 볼륨이 크면 클수록 무분별하게 종속성을 설치하고 사용 안 하는 경우가 굉장히 많이 있다 이 작업만 진행해 줘도 업데이트가 걸리는 거 없이 매우 수월하다

 

3. sdk 35를 충족하는 최소 리액트 네이티브 버전 확인

아래에 설명할 리액트 네이티브 업그레이드 헬퍼로 sdk 35 버전이 리액트 네이티브 무슨 버전에서 적용되는지 확인했다

나의 경우 0.76에서 sdk 35버전이 적용되는 것을 확인했고 최신 버전으로 끝까지 업데이트하지 않는 이유는 이후 새 프로젝트로 expo를 사용하여 개발할 계획이 있기 때문에 적당한 시간을 확보하기 위해서만 버전을 업데이트해 주기로 하였다

 

업그레이드 시작

0.71에서 0.76으로 바로 업데이트하지 않는다 한 번에 업데이트하는 게 불가능 한건 아니지만 리액트 네이티브에서는 버전 사이 크게 변곡점이 있는 구간이 있다 0.72에서의 메트로 구성 변경, 0.73의 자바 => 코틀린 변경, 0.74의 Fliper제거, 0.76의 새로운 아키텍처 기본 적용과 같은 변곡점들의 구간을 한 번에 뛰어넘기에는 리액트 네이티브의 특성상 네이티브 모듈, 리액트 네이티브 모듈, ios, aos의 빌드 툴 이렇게 세 가지가 일치해야 빌드가 되는 최악의 조건 때문에 

0.71 => 0.72 =>0.73 => 0.74 => 0.75.1 => 0.76.9 순서 대로 하나씩 업데이트하는 방법을 선택했다.

 

React native upgrade helper

https://react-native-community.github.io/upgrade-helper/

 

Upgrade React Native applications

 

react-native-community.github.io

리액트 네이티브 버전 업그레이드가 얼마나 까다로우면 업그레이드에 도움을 주는 사이트도 제공되고 있다 가장 꼼꼼히 해야 하는 부분이며 하나라도 코드 삽입이 누락되거나 다르다면 뿜어져 나오는 빌드 에러를 마주할 수 있다

가이드는 어렵지 않으며 라이브러리 업데이트도 한 번에 해주는 라이브러리도 제공하고 있으니 사용하면 된다

 

주의사항

설치된 종속성이 많지가 않다면 종속성 업데이트 라이브러리는 사용안하는게 좋다 리액트 네이티브는 일반적인 업데이트와는 다르게 최신 버전이 레거시 버전을 품고 가지 않는다 또 리액트 네이티브 버전에 맞는 버전을 사용하지 않고 너무 최신버전의 라이브러리를 사용하면 빌드할 수 없다

 

예를 들어 리액트 네이티브 개발에 있어 반필수적인 Reanimated를 보면

만약 내가 리액트 네이티브 0.72 버전을 사용 중 이지만 reanimiated의 버전이 3.17.4의 비교적 최신 버전이라도 사용할 수 없다

그러기에 리액트 네이티브 버전에 따른 정확하게 일치하는 버전의 라이브러리를 사용하는 것이 정답이다

 

선행작업에서의 중요성도 이러한 이유 때문에 수많은 종속성의 버전 서포트를 찾아 업데이트하는 것은 매우 힘든 일이기에 미리 작업을 진행했던 것이다

 

그리고 이제 코드 한줄 한 줄 업그레이드 헬퍼를 보면서 작업을 진행하면 된다 정말 신중하게 천천히 진행해야 한다

 

업그레이드 헬퍼 작업 이후

코드를 다 변경하였다면 이제 쌓여있던 캐시와 충돌 가능성 있는 모듈 찌꺼기 들을 날려줄 리셋 작업이 필요하다

🔎 metro

$ yarn start --reset-cache

 

🔎 Android

$ cd android && ./gradlew clean

 

🔎 IOS

$ cd ios &&  
  rm -rf Pods && 
	rm -rf Podfile.lock &&
	rm -rf build &&
	pod repo remove trunk &&
	pod cache clean --all &&
	pod install

 

출처 : https://lasbe.tistory.com/233

 

여기까지 완료 되었다면 별문제 없이 빌드가 될 텐데 빌드 에러가 나온다면 나의 경우 대부분 종속성 문제였고 각종 캐시들을 날려준 후 재빌드 하면 성공적으로 빌드가 가능하였다

 

마치면서

만약 빌드가 느리다면 PC를 새로 구입 해보자 그리고 빌드를 시작했다면 내 손을 떠났으니 기도하자.

'React-Native' 카테고리의 다른 글

React-native Skia  (0) 2024.03.01