[React Native (RN)] Android Native 코드 수정 후 절차

React Native 구성

React Native 앱은 두 부분으로 나뉜다.

1. JavaScript 코드 

• Metro bundler로 런타임에 로딩
• Metro 서버를 통해 즉시 반영

2. Native 코드 (Java/Kotlin, C++)

• Gradle로 컴파일 (.apk로 포함)
• JS코드처럼 바로 반영되지 않음.
  반드시 Gradle 빌드를 다시 수행해야 네이티브 변경 사항이 실제 앱에 반영됨.
• 예시) AndroidManifest.xml (XML), *.kt (Kotlin), *.java (JAVA), C++, Gradle 등

# android 폴더로 이동 후 Gradle 캐시와 빌드 결과물 정리
cd android

# 이전 빌드 결과를 삭제하고 깨끗한 상태에서 다시 빌드하기 위한 명령어
# Kotlin/Java 코드나 네이티브 모듈 변경 후 클래스 충돌, 빌드 캐시 문제, 에러 발생을 방지
./gradlew clean

# 기존 프로젝트 폴더로 이동
cd ..

# JS 번들 서버(Metro) 실행 → Gradle 빌드 → 디바이스에 앱 설치
npx react-native run-android

 

npx react-native run-android를 하면 전체 자동 실행이지만 가끔 에러가 나기도 한다. (캐시 문제 등)

그래서 나는 주로 npx react-native start --reset-cache로 캐시를 Reset 해준 후 다시 실행한다.

---

발생할 수 있는 문제

1. Unresolved reference

• 원인: 코드 변경 후 ./gradlew clean 없이 바로 빌드
• 해결: gradle 캐시와 빌드 결과물 정리

# android 폴더로 이동 후 Gradle 캐시와 빌드 결과물 정리
cd android
./gradlew clean

2. Module not found

• 원인: MainApplication.java 또는 getPackages()에 등록되지 않음
• 해결: MainApplication.kt, getPackages()에 등록 여부 확인

//프로젝트 상단에 import도 해야함
import com.프로젝트명.폴더명.MultiImagePickerPackage

class MainApplication : Application(), ReactApplication {

  override val reactNativeHost: ReactNativeHost =
      object : DefaultReactNativeHost(this) {
        override fun getPackages(): List<ReactPackage> =
            PackageList(this).packages.apply {
              // 여기에 추가
              add(MultiImagePickerPackage())
            }
      ...

3. NativeModules.xxx is null

• 원인: JS에서 네이티브 모듈이 연결되지 않음 (빌드 미반영)
• 해결: 앱 재빌드 후 재실행

4. Cannot read property 'xxx' of null

• 원인: Native Module이 JS에서 제대로 연결되지 않았을 때 발생 (빌드 누락)
• 해결: 앱 재빌드 후 재실행

---

이상입니다.