# Expo | Sentry for React Native

To set up the Sentry React Native SDK in your Expo project, follow the steps on this page.

## [Prerequisites](https://docs.sentry.io/platforms/react-native/manual-setup/expo.md#prerequisites)

* [Expo SDK 50](https://docs.expo.dev/workflow/upgrading-expo-sdk-walkthrough/) or newer.
  * [Expo SDK 49](https://docs.expo.dev/guides/using-sentry/) and older are supported by the `sentry-expo` package.
* [Migrate from `sentry-expo` to `@sentry/react-native`](https://docs.sentry.io/platforms/react-native/migration/sentry-expo.md).
* [Sign up for an account](https://sentry.io/signup/).

## [Automatic Install](https://docs.sentry.io/platforms/react-native/manual-setup/expo.md#automatic-install)

Use the [Sentry Wizard](https://github.com/getsentry/sentry-wizard) to patch your project automatically, as shown below. Alternatively, you can follow the [Manual Install](https://docs.sentry.io/platforms/react-native/manual-setup/expo.md#manual-install) if you prefer. You only need to patch the project once. Then, you can add the patched files to your version control system.

```bash
npx @sentry/wizard@latest -i reactNative
```

The following tasks will be performed by the Sentry Wizard

* Install the `@sentry/react-native` package.
* Add the `@sentry/react-native/metro` to the **metro.config.js** Metro configuration.
* Add the `@sentry/react-native/expo` to the **app.json** Expo configuration.
* Enable the Sentry React Native Gradle build step for Android to auto-upload generated source maps and debug symbols.
* Wrap the *Bundle React Native code and images* Xcode project build phase script to upload generated source maps and collect bundled node modules.
* Add *Upload Debug Symbols to Sentry* Xcode project build phase.
* Run `pod install`.
* Store build credentials in **ios/sentry.properties**, **android/sentry.properties** and **env.local**.
* Configure Sentry for the supplied DSN in your **layout.tsx** file.

## [Manual Install](https://docs.sentry.io/platforms/react-native/manual-setup/expo.md#manual-install)

If you don't use the Wizard, install the `@sentry/react-native` package:

```bash
npx expo install @sentry/react-native
```

### [Initialize the SDK](https://docs.sentry.io/platforms/react-native/manual-setup/expo.md#initialize-the-sdk)

Error Monitoring\[ ]Logs\[ ]Session Replay\[ ]Tracing\[ ]Profiling

Import the `@sentry/react-native` package and call `init` with your DSN:

```javascript
import { Stack } from "expo-router";
import * as Sentry from "@sentry/react-native";

Sentry.init({
  dsn: "___PUBLIC_DSN___",
  // Adds more context data to events (IP address, cookies, user, etc.)
  // For more information, visit: https://docs.sentry.io/platforms/react-native/data-management/data-collected/
  sendDefaultPii: true,
  // ___PRODUCT_OPTION_START___ performance
  // Set tracesSampleRate to 1.0 to capture 100% of transactions for tracing.
  // We recommend adjusting this value in production.
  // Learn more at
  // https://docs.sentry.io/platforms/react-native/configuration/options/#traces-sample-rate
  tracesSampleRate: 1.0,
  // ___PRODUCT_OPTION_END___ performance
  // ___PRODUCT_OPTION_START___ logs
  // Enable logs to be sent to Sentry
  // Learn more at https://docs.sentry.io/platforms/react-native/logs/
  enableLogs: true,
  // ___PRODUCT_OPTION_END___ logs
  // ___PRODUCT_OPTION_START___ profiling
  // profilesSampleRate is relative to tracesSampleRate.
  // Here, we'll capture profiles for 100% of transactions.
  profilesSampleRate: 1.0,
  // ___PRODUCT_OPTION_END___ profiling
  // ___PRODUCT_OPTION_START___ session-replay
  // Record session replays for 100% of errors and 10% of sessions
  replaysOnErrorSampleRate: 1.0,
  replaysSessionSampleRate: 0.1,
  integrations: [Sentry.mobileReplayIntegration()],
  // ___PRODUCT_OPTION_END___ session-replay
});

function RootLayout() {
  return <Stack />;
}

export default Sentry.wrap(RootLayout);
```

### [Wrap Your App](https://docs.sentry.io/platforms/react-native/manual-setup/expo.md#wrap-your-app)

Wrap the root component of your application with `Sentry.wrap`:

```javascript
export default Sentry.wrap(RootLayout);
```

### [Add the Sentry Expo Plugin](https://docs.sentry.io/platforms/react-native/manual-setup/expo.md#add-the-sentry-expo-plugin)

To ensure bundles and source maps are automatically uploaded during the native applications builds, add `withSentry` to the Expo application configuration:

```javascript
{
  "expo": {
    "plugins": [
      [
        "@sentry/react-native/expo",
        {
          "url": "https://sentry.io/",
          "note": "Use SENTRY_AUTH_TOKEN env to authenticate with Sentry.",
          "project": "___PROJECT_SLUG___",
          "organization": "___ORG_SLUG___"
        }
      ]
    ]
  }
}
```

Add auth token to your environment:

```bash
# DO NOT COMMIT YOUR AUTH TOKEN
export SENTRY_AUTH_TOKEN=___ORG_AUTH_TOKEN___
```

### [Add Sentry Metro Plugin](https://docs.sentry.io/platforms/react-native/manual-setup/expo.md#add-sentry-metro-plugin)

To ensure unique Debug IDs get assigned to the generated bundles and source maps, add Sentry Serializer to the Metro configuration:

```javascript
// const { getDefaultConfig } = require("expo/metro-config");
const { getSentryExpoConfig } = require("@sentry/react-native/metro");

// const config = getDefaultConfig(__dirname);
const config = getSentryExpoConfig(__dirname);

module.exports = config;
```

### [Add Privacy Manifest](https://docs.sentry.io/platforms/react-native/manual-setup/expo.md#add-privacy-manifest)

The SDK needs access to certain information about the device and the application for its essential functionality. Some of the APIs required for this are considered privacy-relevant. Add the privacy manifest to your Xcode project to ensure your app is compliant with Apple's guidelines. Read the [Apple Privacy Manifest](https://docs.sentry.io/platforms/react-native/data-management/apple-privacy-manifest.md) guide for more info on how to add records required for the Sentry SDKs.

## [Verify Setup](https://docs.sentry.io/platforms/react-native/manual-setup/expo.md#verify-setup)

To verify that everything is working as expected, build the `Release` version of your application and send a test event to Sentry by adding:

```javascript
<Button
  title="Try!"
  onPress={() => {
    Sentry.captureException(new Error("First error"));
  }}
/>;
```

## [Next Steps](https://docs.sentry.io/platforms/react-native/manual-setup/expo.md#next-steps)

* [Learn how to upload source maps for native builds and Expo Updates](https://docs.sentry.io/platforms/react-native/sourcemaps/uploading/expo.md)
* [Add automatic tracing with Expo Router](https://docs.sentry.io/platforms/react-native/tracing/instrumentation/expo-router.md)
* [Configure the Sentry Android Gradle Plugin](https://docs.sentry.io/platforms/react-native/manual-setup/expo/gradle.md)

## [Notes](https://docs.sentry.io/platforms/react-native/manual-setup/expo.md#notes)

* Don't commit your auth token. Instead, use an environment variable like `SENTRY_AUTH_TOKEN`.
* Source maps for the `Release` version of your application are uploaded automatically during the native application build.
* During development, the source code is resolved using the Metro Server and source maps aren't used. This currently doesn't work on web.

## Pages in this section

- [gradle](https://docs.sentry.io/platforms/react-native/manual-setup/expo/gradle.md)
