Search code examples
androidfirebasereact-nativesource-mapsreact-native-hermes

react-native source map of hermes bundle with firebase crashlytics


I want to read crashlytics reports from react-native app but it's not readable at all in firebase console. Example crash from Android looks like this:

Non-fatal Exception: io.invertase.firebase.crashlytics.UnhandledPromiseRejection
Invalid RegExp pattern: Parenthesized expression not closed
.RegExp ((native):0:0)
.anonymous (address at index.android.bundle:1:2065589)
.ue (address at index.android.bundle:1:2070284)
.ce (address at index.android.bundle:1:2069288)
.Be (address at index.android.bundle:1:2080135)

I have hermes enabled and my signed build apk generate index.android.bundle in precompiled format (build/generated/assets/react/appName/release/index.android.bundle) with source map file build/sourcemaps/react/appName/release/index.android.bundle.map. I tried to read those files using npm package source-map-explorer but unfortunately it always produce below error:

source-map-explorer index.android.bundle index.android.bundle.map 
index.android.bundle
  Your source map refers to generated column 165922 on line 1, but the source only contains 165920 column(s) on that line.
  Check that you are using the correct source map.
  1. Can i upload source-map to firebase in order to make errors readable in firebase console?
  2. How can i read hermes bundle file using sourcemap?

Solution

  • You just need to use

    npx metro-symbolicate android/app/build/generated/sourcemaps/react/release/index.android.bundle.map < stacktrace.txt
    

    put your stacktrace in stacktrack.txt. (remove the 0:0 for it to work)

    for more information please go to https://reactnative.dev/docs/next/symbolication