Skip to main content
Version: Next

릴리스 빌드 디버깅

스택 트레이스 심볼리케이션​

릴리스 빌드에서 React Native 앱이 처리되지 않은 예외를 던지면, 출력 결과가 난독화되어 읽기 어려울 수 있다.

shell
07-15 10:58:25.820 18979 18998 E AndroidRuntime: FATAL EXCEPTION: mqt_native_modules
07-15 10:58:25.820 18979 18998 E AndroidRuntime: Process: com.awesomeproject, PID: 18979 07-15 10:58:25.820 18979 18998 E AndroidRuntime: com.facebook.react.common.JavascriptException: Failed, js engine: hermes, stack:
07-15 10:58:25.820 18979 18998 E AndroidRuntime: p@1:132161
07-15 10:58:25.820 18979 18998 E AndroidRuntime: p@1:132084
07-15 10:58:25.820 18979 18998 E AndroidRuntime: f@1:131854
07-15 10:58:25.820 18979 18998 E AndroidRuntime: anonymous@1:131119

위 스택 트레이스에서 p@1:132161과 같은 항목은 최소화된 함수 이름과 바이트코드 오프셋이다. 이러한 호출을 디버깅하려면 파일, 라인, 함수 이름으로 변환해야 한다. 예를 들어 AwesomeProject/App.js:54:initializeMap과 같이 변환한다. 이를 심볼리케이션이라고 한다.

최소화된 함수 이름과 바이트코드를 심볼리케이션하려면 스택 트레이스와 생성된 소스맵을 metro-symbolicate에 전달하면 된다.

소스맵 활성화​

스택 트레이스를 심볼화하려면 소스맵이 필요하다. 타겟 플랫폼의 빌드 설정에서 소스맵이 활성화되어 있는지 확인한다.

info

안드로이드에서는 소스맵이 기본적으로 활성화되어 있다.

소스맵 생성을 활성화하려면 android/app/build.gradle 파일에 다음 hermesFlags가 포함되어 있는지 확인한다.

groovy
react {
    hermesFlags = ["-O", "-output-source-map"]
}

정상적으로 설정했다면 Metro 빌드 출력에서 소스맵의 출력 위치를 확인할 수 있다.

text
Writing bundle output to:, android/app/build/generated/assets/react/release/index.android.bundle
Writing sourcemap output to:, android/app/build/intermediates/sourcemaps/react/release/index.android.bundle.packager.map

metro-symbolicate 사용하기​

소스 맵이 생성되면 이제 스택 트레이스를 변환할 수 있다.

shell
# 사용법 안내 출력
npx metro-symbolicate

# 스택 트레이스가 포함된 파일에서 변환
npx metro-symbolicate android/app/build/generated/sourcemaps/react/release/index.android.bundle.map < stacktrace.txt

# adb logcat에서 변환 (Android)
adb logcat -d | npx metro-symbolicate android/app/build/generated/sourcemaps/react/release/index.android.bundle.map

소스 맵에 대한 참고 사항​

  • 빌드 과정에서 여러 개의 소스 맵이 생성될 수 있다. 예제에 표시된 위치에 있는 소스 맵을 사용해야 한다.
  • 사용하는 소스 맵이 크래시가 발생한 앱의 정확한 커밋과 일치하는지 확인한다. 소스 코드의 작은 변경도 오프셋에 큰 차이를 만들 수 있다.
  • metro-symbolicate가 성공 상태로 즉시 종료된다면, 입력이 터미널에서 직접 전달된 것이 아니라 파이프나 리디렉션을 통해 전달되었는지 확인한다.