Hermes

Sentry added support for react-native builds that use the hermes engine, which required changes to the sentry SDK, sentry-cli as well as Sentry itself.

Sentry customers using the

For self-hosted Sentry users, the minimum version required is f07352b.

Once you have the minimum version of the SDK, Sentry provides the standard integration as described in the React Native Sentry documentation.

Source Maps

If you do not need custom source maps, the sentry.gradle build step fully supports Hermes source maps.

Custom Source Maps

This document walks through the steps to manually generate and upload custom source maps. When generating your source maps, it's important to match the steps of your React Native tooling exactly, otherwise the generated bundle won't work correctly, and your errors may point to unrelated lines.

The React Native tooling steps are extracted from react-native-xcode.sh for iOS and from BundleHermesCTask.kt for Android.

Compile Source maps

Depending on how your app bundle was generated not all these compilation steps are required:

• If you use EXTRA_PACKAGER_ARGS on iOS, only the first step applies. This is the default behavior if you used @sentry/wizard.
• If you use SOURCEMAP_FILE, all steps are necessary.

1. Bundle/minify with metro (react-native) to get the bundle (.bundle or .jsbundle) and packager source map (.map):

npx react-native bundle --platform android --dev false --entry-file index.js --reset-cache --bundle-output index.android.bundle --sourcemap-output index.android.bundle.packager.map --minify false

2. Compile to bytecode using hermes to get the compiler source map (.hbc.map):

If you're using Hermes with React Native 0.68 or below:

node_modules/hermes-engine/{OS-BIN}/hermesc -O -emit-binary -output-source-map -out=index.android.bundle.hbc index.android.bundle
rm -f index.android.bundle
mv index.android.bundle.hbc index.android.bundle

Starting with React Native 0.69, hermes has been shipped with React Native, so you should use hermesc from react-native:

node_modules/react-native/sdks/hermesc/{OS-BIN}/hermesc -O -emit-binary -output-source-map -out=index.android.bundle.hbc index.android.bundle
rm -f index.android.bundle
mv index.android.bundle.hbc index.android.bundle

3. Merge the two source maps using compose-source-maps to get the final source map (.map):

node node_modules/react-native/scripts/compose-source-maps.js index.android.bundle.packager.map index.android.bundle.hbc.map -o index.android.bundle.map

Upload the Bundle and Source Maps

Upload your source maps following Step 3 on the normal source maps guide.