Manual Configuration
If you can’t (or prefer not to) run the automatic setup, use the instructions below to configure your application.
Prerequisite
iOS
Linking the Native Library via CocoaPods
To link the Native library via CocoaPods, link to the Native module in your Podfile. In React Native versions 0.60 and above, the podspec should be automatically linked, if that's not the case, you can link to the native module manually by adding the RNSentry.podspec
to your Podfile. See below:
pod 'RNSentry', :path => '../node_modules/@sentry/react-native/RNSentry.podspec'
Upload Debug Symbols
Debug symbols help provide you with readable stack traces, which Sentry displays on the Issue Details page, to help you triage an issue. With our React Native SDK, debug symbols are used to symbolicate Native layer (iOS/Android) events. When you use Xcode, you can hook directly into the build process to upload debug symbols. When linking, one build phase script is changed and two more are added.
Bundle React Native Code and Images
We modify the React Native build phase (“Bundle React Native code and images”) slightly from this:
set -e
WITH_ENVIRONMENT="../node_modules/react-native/scripts/xcode/with-environment.sh"
REACT_NATIVE_XCODE="../node_modules/react-native/scripts/react-native-xcode.sh"
/bin/sh -c "$WITH_ENVIRONMENT $REACT_NATIVE_XCODE"
To this:
export SENTRY_PROPERTIES=sentry.properties
export EXTRA_PACKAGER_ARGS="--sourcemap-output $DERIVED_FILE_DIR/main.jsbundle.map"
set -e
# RN 0.69+
WITH_ENVIRONMENT="../node_modules/react-native/scripts/xcode/with-environment.sh"
REACT_NATIVE_XCODE="../node_modules/react-native/scripts/react-native-xcode.sh"
SENTRY_CLI="../node_modules/@sentry/cli/bin/sentry-cli"
/bin/sh -c "$WITH_ENVIRONMENT \"$SENTRY_CLI react-native xcode $REACT_NATIVE_XCODE\""
# RN 0.46 – 0.68
# ../node_modules/@sentry/cli/bin/sentry-cli react-native xcode \
# ../node_modules/react-native/scripts/react-native-xcode.sh
# All versions
/bin/sh ../node_modules/@sentry/react-native/scripts/collect-modules.sh
Additionally, we add a build script named “Upload Debug Symbols to Sentry” to upload debug symbols to Sentry.
Upload Debug Symbols to Sentry
To upload source maps and symbols to Sentry, create a new Run Script build phase using the following script:
export SENTRY_PROPERTIES=sentry.properties
[[ $SENTRY_INCLUDE_NATIVE_SOURCES == "true" ]] && INCLUDE_SOURCES_FLAG="--include-sources" || INCLUDE_SOURCES_FLAG=""
SENTRY_CLI="../node_modules/@sentry/cli/bin/sentry-cli"
$SENTRY_CLI debug-files upload "$INCLUDE_SOURCES_FLAG" "$DWARF_DSYM_FOLDER_PATH"
By default, uploading of debug simulator builds is disabled for speed reasons. If you want to generate debug symbols for debug builds, you can pass --allow-fetch
as a parameter to react-native-xcode
in the above mentioned build phase.
For more information visit Sentry CLI Apple Debug Symbols documentation.
Using node with nvm or Volta
If you are using nvm or Volta, Xcode has trouble locating the default node binary, which can look similar to the troubleshooting example.
Android
For Android, we hook into Gradle for the source map build process. When you run npx @sentry/wizard -i reactNative -p ios android
, the Gradle files are automatically updated. If you can't or don't want to do that, you can follow the steps below to update the files.
Enable Gradle Integration
We enable the Gradle integration in your android/app/build.gradle
file by adding the following line before the android
options:
android/app/build.gradle
apply from: "../../node_modules/@sentry/react-native/sentry.gradle"
Enable Sentry AGP
You can enable native symbol upload and other features by adding the Sentry Android Gradle Plugin (AGP) dependency to android/build.gradle
.
android/build.gradle
buildscript {
dependencies {
// Other dependencies ...
classpath("io.sentry:sentry-android-gradle-plugin:3.12.0")
}
}
You can configure the plugin options in android/app/build.gradle
, as shown below:
android/app/build.gradle
apply plugin: "io.sentry.android.gradle"
sentry {
// Enables or disables the automatic configuration of Native Symbols
// for Sentry. This executes sentry-cli automatically so
// you don't need to do it manually.
// Default is disabled.
uploadNativeSymbols = true
// Enables or disables the automatic upload of the app's native source code to Sentry.
// This executes sentry-cli with the --include-sources param automatically so
// you don't need to do it manually.
// This option has an effect only when [uploadNativeSymbols] is enabled.
// Default is disabled.
includeNativeSources = true
// `@sentry/react-native` ships with compatible `sentry-android`
// This option would install the latest version that ships with the SDK or SAGP (Sentry Android Gradle Plugin)
// which might be incompatible with the React Native SDK
// Enable auto-installation of Sentry components (sentry-android SDK and okhttp, timber and fragment integrations).
// Default is enabled.
autoInstallation {
enabled = false
}
}
Enable Logging for sentry-cli
You can also enable logging for sentry-cli
by adding this config before the above apply from:
line:
android/app/build.gradle
project.ext.sentryCli = [
logLevel: "debug"
]
apply from: "../../node_modules/@sentry/react-native/sentry.gradle"
Fetch sentry.properties
We also support fetching different sentry.properties
files for different flavors. For that, you need to add:
android/app/build.gradle
project.ext.sentryCli = [
logLevel: "debug",
flavorAware: true
]
apply from: "../../node_modules/@sentry/react-native/sentry.gradle"
The corresponding flavor files should also be placed within the specific build type folder where you intend to use them. For example, the "Android demo release" flavor would be react-native/android/sentry-demo-release.properties
.
We recommend leaving logLevel: "debug"
since we look for specific sentry.properties
files depending on your flavor's name.
Include the
android/app/build.gradle
:android/app/build.gradle
dependencies {
// ... other dependencies listed here //
implementation project(':@sentry_react-native')
}
If you're linking manually, make sure your MainApplication.java
is similar to:
import io.sentry.react.RNSentryPackage;
public class MainApplication extends Application implements ReactApplication {
@Override
protected List<ReactPackage> getPackages() {
List<ReactPackage> packages = new PackageList(this).getPackages();
packages.add(new RNSentryPackage());
return packages;
}
}
Add the following to your settings.gradle
file:
android/settings.gradle
include ':@sentry_react-native'
project(':@sentry_react-native').projectDir = new File(rootProject.projectDir, '../node_modules/@sentry/react-native/android')
Our documentation is open source and available on GitHub. Your contributions are welcome, whether fixing a typo (drat!) to suggesting an update ("yeah, this would be better").
- Package:
- npm:@sentry/react-native
- Version:
- 5.9.2
- Repository:
- https://github.com/getsentry/sentry-react-native