sentry-react-sdk

Configure Sentry error monitoring, performance tracing, and session replay for React applications.

Updated Jun 4, 2026
One-click install
npx skills add https://github.com/achmf/KostaHub --skill sentry-react-sdk-achmf
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: sentry-react-sdk
Source: https://github.com/achmf/KostaHub/tree/main/.agents/skills/sentry-react-sdk
Command: npx skills add https://github.com/achmf/KostaHub --skill sentry-react-sdk-achmf

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @sentry/react, @sentry/vite-plugin, @sentry/webpack-plugin, @craco/craco, and includes references (resource) components.

What problem does it solve?

This Skill solves the complexity of manually configuring error monitoring, performance tracing, and session replay in React applications, ensuring you don't miss critical production issues.

Core Features & Use Cases

  • Automated Setup: Guides you through the installation and initialization of the Sentry SDK, including React-specific error boundaries and router integrations.
  • Observability: Configures error monitoring, performance tracing, and session replay to give you full visibility into user experiences.
  • Use Case: When you need to add robust error tracking to a React application using Vite or Webpack, this Skill provides the exact configuration for instrumenting your entry point and setting up source map uploads.

Quick Start

Invoke the sentry-react-sdk skill to automatically detect your React project configuration and guide you through the complete Sentry instrumentation process.

Frequently Asked Questions about sentry-react-sdk

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I set up Sentry error monitoring in a React application?

To set up Sentry error monitoring in a React application, you need to initialize the Sentry SDK at your entry point, configure error boundaries, and integrate your router for comprehensive error tracking and performance tracing.

How do I configure Sentry source map uploads with Vite or Webpack?

Configuring Sentry source map uploads involves integrating the Sentry Vite plugin or Webpack plugin into your build process, ensuring that production errors are accurately mapped back to your original React source code.

Does Sentry React SDK support performance tracing and session replay?

Yes, Sentry React SDK support includes performance tracing and session replay configuration, providing full visibility into production user experiences and capturing framework-specific errors across React 16 through 19.

Can I use Sentry for error tracking in React projects using craco?

Yes, you can use Sentry for error tracking in React projects using craco by utilizing the craco configuration dependency alongside the Sentry Webpack plugin to instrument your build and upload source maps.

What is the best way to add observability to a React Vite application?

The best way to add observability to a React Vite application is by instrumenting the entry point with the Sentry React SDK, enabling automated error monitoring, performance tracing, and session replay.

Why do I need React error boundaries for Sentry error tracking?

React error boundaries are needed for Sentry error tracking to catch framework-specific rendering errors gracefully, preventing full application crashes while ensuring the exception is captured and reported to your monitoring dashboard.