sentry-react-native-sdk

Full Sentry SDK setup for React Native and Expo. Use when asked to "add Sentry to React Native", "install @sentry/react-native", "setup Sentry in Expo", or configure error monitoring, tracing, profiling, session replay, or logging for React Native applications. Supports Expo managed, Expo bare, and

By getsentry · 453 installs

npx skills add getsentry/sentry-agent-skills --skill sentry-react-native-sdk

Source repository · Upstream listing

Sentry React Native SDK Opinionated wizard that scans your React Native or Expo project and guides you through complete Sentry setup — error monitoring, tracing, profiling, session replay, logging, and more. Invoke This Skill When User asks to "add Sentry to React Native" or "set up Sentry" in an RN or Expo app User wants error monitoring, tracing, profiling, session replay, or logging in React Native User mentions @sentry/react native , mobile error tracking, or Sentry for Expo User wants to monitor native crashes, ANRs, or app hangs on iOS/Android Note: SDK versions and APIs below reflect current Sentry docs at time of writing ( @sentry/react native ≥6.0.0, minimum recommended ≥8.0.0). Always verify against [docs.sentry.io/platforms/react native/](https://docs.sentry.io/platforms/react native/) before implementing. Phase 1: Detect Run these commands to understand the project before making any recommendations: What to determine: Question Impact expo in package.json ? Expo path (config plugin + getSentryExpoConfig ) vs bare/vanilla RN path Expo SDK ≥50? @sentry/react native directly; older = sentry expo (legacy, do not use) app.json has "expo" key? Managed Expo — wizard is simplest; config plugin handles all native config app/ layout.tsx present? Expo Router project — init goes in layout.tsx @sentry/react native already in package.json ? Skip install, jump to feature config @react navigation/native present? Recommend reactNavigationIntegration for screen tracking react native navigation present? Recommend reactNativeNavigationIntegration (Wix) Backend directory detected? Trigger Phase 4 cross link Phase 2: Recommend Present a concrete recommendation based on what you found. Don't ask open ended questions — lead with a proposal: Recommended (core coverage — always set up these): ✅ Error Monitoring — captures JS exceptions, native crashes (iOS + Android), ANRs, and app hangs ✅ Tracing — mobile performance is critical; auto instruments navigation, app start, network requests ✅ Session Replay — mobile replay captures screenshots and touch events for debugging user issues Optional (enhanced observability): ⚡ Profiling — CPU profiling on iOS (JS profiling cross platform); low overhead in production ⚡ Logging — structured logs via Sentry.logger. ; links to traces for full context ⚡ User Feedback — collect user submitted bug reports directly from your app Recommendation logic: Feature Recommend when... Error Monitoring Always — non negotiable baseline for any mobile app Tracing Always for mobile — app start, navigation, and network latency matter Session Replay User facing production app; debug user reported issues visually Profiling Performance sensitive screens, startup time concerns, or production perf investigations Logging App uses structured logging, or you want log to trace correlation in Sentry User Feedback Beta or customer facing app where you want user submitted bug reports Propose: "For your [Expo managed / bare RN] app, I recommend setting up Error Monitoring + Tracing + Session Replay. Want me to also add Profiling and Logging?" Phase 3: Guide Determine Your Setup Path Project type Recommended setup Complexity Expo managed (SDK 50+) Wizard CLI or manual with config plugin Low — wizard does everything Expo bare (SDK 50+) Wizard CLI recommended Medium — handles iOS/Android config Vanilla React Native (0.69+) Wizard CLI recommended Medium — handles Xcode + Gradle Expo SDK <50 Use sentry expo (legacy) See [legacy docs](https://docs.sentry.io/platforms/react native/manual setup/expo/) Path A: Wizard CLI (Recommended for all project types) Run the wizard — it walks you through login, org/project selection, and auth token setup interactively. It then handles installation, native config, source map upload, and initial Sentry.init() : What the wizard creates/modifies: File Action Purpose package.json Installs @sentry/react native Core SDK metro.config.js Adds @sentry/react native/metro serializer Source map generation app.json Adds @sentry/react native/expo plugin (Expo only) Config plugin for native builds App.tsx / layout.tsx Adds Sentry.init() and Sentry.wrap() SDK initialization ios/sentry.properties Stores org/project/token iOS source map + dSYM upload android/sentry.properties Stores org/project/token Android source map upload android/app/build.gradle Adds Sentry Gradle plugin Android source maps + proguard ios/[AppName].xcodeproj Wraps "Bundle RN" build phase + adds dSYM upload iOS symbol upload .env.local SENTRY AUTH TOKEN Auth token (add to .gitignore ) After the wizard runs, skip to [Verification]( verification). Path B: Manual — Expo Managed (SDK 50+) Step 1 — Install Step 2 — metro.config.js If metro.config.js doesn't exist yet: Step 3 — app.json — Add Expo config plugin Note: Set SENTRY AUTH TOKEN as an environment variable for native builds — never commit it to version control. Step 4 — Initialize Sentry For Expo Router ( app/ layout.tsx ): For standard Expo ( App.tsx ): Path C: Manual — Bare React Native (0.69+) Step 1 — Install Step 2 — metro.config.js Step 3 — iOS: Modify Xcode build phase Open ios/[AppName].xcodeproj in Xcode. Find the "Bundle React Native code and images" build phase and replace the script content with: Step 4 — iOS: Add "Upload Debug Symbols to Sentry" build phase Add a new Run Script build phase in Xcode (after the bundle phase): Step 5 — iOS: ios/sentry.properties Step 6 — Android: android/app/build.gradle Add before the android {} block: Step 7 — Android: android/sentry.properties Step 8 — Initialize Sentry ( App.tsx or entry point) Quick Reference: Full Featured Sentry.init() This is the recommended starting configuration with all features enabled: Navigation Setup — React Navigation (v5+) Navigation Setup — Wix React Native Navigation Wrap Your Root Component Always wrap your root component — this enables React error boundaries and ensures crashes at the component tree level are captured: For Each Agreed Feature Walk through features one at a time. Load the reference file for each, follow its steps, then verify before moving on: Feature Reference Load when... Error Monitoring ${SKILL ROOT}/references/error monitoring.md Always (baseline) Tracing & Performance ${SKILL ROOT}/references/tracing.md Always for mobile (app start, navigation, network) Profiling ${SKILL ROOT}/references/profiling.md Performance sensitive production apps Session Replay ${SKILL ROOT}/references/session replay.md User facing apps Logging ${SKILL ROOT}/references/logging.md Structured logging / log to trace correlation User Feedback ${SKILL ROOT}/references/user feedback.md Collecting user submitted reports For each feature: Read ${SKILL ROOT}/references/<feature .md , follow steps exactly, verify it works. Configuration Reference Core Sentry.init() Options Option Type Default Purpose dsn string — Required. Project DSN; SDK disabled if empty. Env: SENTRY DSN environment string — e.g., "production" , "staging" . Env: SENTRY ENVIRONMENT release string — App version, e.g., "my app@1.0.0+42" . Env: SENTRY RELEASE dist string — Build number / variant identifier (max 64 chars) sendDefaultPii boolean false Include PII: IP address, cookies, user data sampleRate number 1.0 Error event sampling (0.0–1.0) maxBreadcrumbs number 100 Max breadcrumbs per event attachStacktrace boolean true Auto attach stack traces to messages attachScreenshot boolean false Capture screenshot on error (SDK ≥4.11.0) attachViewHierarchy boolean false Attach JSON view hierarchy as attachment debug boolean false Verbose SDK output. Never use in production enabled boolean true Disable SDK entirely (e.g., for testing) ignoreErrors string[] \ RegExp[] — Drop errors matching these patterns ignoreTransactions string[] \ RegExp[] — Drop transactions matching these patterns maxCacheItems number 30 Max offline cached envelopes defaultIntegrations boolean true Set false to disable all default integrations integrations array \ function — Add or filter integrations Tracing Options Option Type Default Purpose tracesSampleRate number 0 Transaction sample rate (0–1). Use 1.0 in dev tracesSampler function — Per transaction sampling; overrides tracesSampleRate tracePropagationTargets (string \ RegExp)[] [/. /] Which API URLs receive distributed tracing headers profilesSampleRate number 0 Profiling sample rate (applied to traced transactions) Native / Mobile Options Option Type Default Purpose enableNative boolean true Set false for JS only (no native SDK) enableNativeCrashHandling boolean true Capture native hard crashes (iOS/Android) enableNativeFramesTracking boolean — Slow/frozen frames tracking. Disable in Expo Go enableWatchdogTerminationTracking boolean true OOM kill detection (iOS) enableAppHangTracking boolean true App hang detection (iOS, tvOS, macOS) appHangTimeoutInterval number 2 Seconds before classifying as app hang (iOS) enableAutoPerformanceTracing boolean true Auto performance instrumentation enableNdkScopeSync boolean true Java→NDK scope sync (Android) attachThreads boolean false Auto attach all threads on crash (Android) autoInitializeNativeSdk boolean true Set false for manual native init onReady function — Callback after native SDKs initialize Session & Release Health Options Option Type Default Purpose autoSessionTracking boolean true Session tracking (crash free users/sessions) sessionTrackingIntervalMillis number 30000 ms of background before session ends Replay Options Option Type Default Purpose replaysSessionSampleRate number 0 Fraction of all sessions recorded replaysOnErrorSampleRate number 0 Fraction of error sessions recorded Logging Options (SDK ≥7.0.0) Option Type Purpose enableLogs boolean Enable Sentry.logger. API beforeSendLog function Filter/modify logs before sending logsOrigin 'native' \ 'js' \ 'all' Filter log source (SDK ≥7.7.0) Hook Options Option Type Purpose beforeSend (event, hint) = event \ null Modify/drop JS error events. ⚠️ Does NOT apply to native crashes beforeSendTransaction (event) = event \ null Modify/drop transaction events beforeBreadcrumb (breadcrumb, hint) = breadcrumb \ null Process breadcrumbs before storage Environment Variables Variable Purpose Notes SENTRY DSN Data Source Name Falls back from dsn option SENTRY AUTH TOKEN Upload source maps and dSYMs Never commit — use CI secrets SENTRY ORG Organization slug Used by wizard and build plugins SENTRY PROJECT Project slug Used by wizard and build plugins SENTRY RELEASE Release identifier Falls back from release option SENTRY ENVIRONM