# sentry-react-sdk

Скилл проводит через полную настройку Sentry в React-проекте: сканирует зависимости, предлагает набор функций и пишет конфиг. Пригодится, когда нужно подключить мониторинг ошибок без ручного разбора документации.

- скилл · `type=skill` · Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, OpenCode · 3100 установок · ★ 272
- Автор: getsentry
- Лицензия: Apache-2.0 · policy=mirror · лицензия открытая, файл — в исходнике
- Исходник: https://github.com/getsentry/sentry-for-ai/tree/HEAD/skills-legacy/sentry-react-sdk/SKILL.md
- Обновлён: 2026-10-23
- HTML: https://affpapa.org/nevibecode/skills/sentry-react-sdk

## Что делает

Скилл работает в три фазы. Сначала он читает `package.json` и конфиги сборки: версию React, наличие `@sentry/react`, роутер, Redux, Vite или webpack, логирующие библиотеки. Потом предлагает конкретный набор — мониторинг ошибок и трейсинг он считает базой для React SPA, Session Replay добавляет для приложений с логином и оплатой, а логирование и профилирование оставляет на выбор. Дальше ведёт по шагам: установка пакета, отдельный файл `src/instrument.ts` с `Sentry.init()`, импорт этого файла первой строкой в точке входа.

Внутри есть готовые шаблоны под разные сборщики. Для Vite DSN берётся из `VITE_SENTRY_DSN`, для Create React App — из `REACT_APP_SENTRY_DSN`, для своего webpack — из `SENTRY_DSN`. Для React 19 скилл ставит `reactErrorHandler()` на `createRoot`, для более старых версий — `Sentry.ErrorBoundary`. Если найден React Router в режиме Framework с `@sentry/react-router`, скилл отправляет к другому скиллу, `sentry-react-router-framework-sdk` — этот случай он не покрывает.

Профилирование помечено как экспериментальное и требует заголовков cross-origin isolation, так что включать его стоит осознанно. Значения `tracesSampleRate: 1.0` и `replaysSessionSampleRate: 0.1` в шаблоне — стартовая точка, для продакшена скилл советует снижать частоту трейсинга. Перед внедрением сверяйтесь с актуальной документацией Sentry: версии API меняются.

## Требования
- Работает с: Sentry

## Установка

### Claude Code (родная платформа)

1. **Через Skills CLI (Vercel)**
```bash
npx skills add getsentry/sentry-for-ai --skill sentry-react-sdk -a claude-code
```

2. **Вручную: положить файлы**
- Файл: `~/.claude/skills/sentry-react-sdk/SKILL.md` — Папка скилла целиком; для одного проекта — .claude/skills/sentry-react-sdk/

### Codex

1. **Через Skills CLI (Vercel)**
```bash
npx skills add getsentry/sentry-for-ai --skill sentry-react-sdk -a codex
```

2. **Вручную: положить файлы**
- Файл: `.agents/skills/sentry-react-sdk/SKILL.md` — Для всех проектов — ~/.agents/skills/

### Cursor

1. **Через Skills CLI (Vercel)**
```bash
npx skills add getsentry/sentry-for-ai --skill sentry-react-sdk -a cursor
```

2. **Вручную: положить файлы**
- Файл: `.cursor/skills/sentry-react-sdk/SKILL.md` — Cursor читает и .agents/skills/, и .claude/skills/

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install getsentry/sentry-for-ai sentry-react-sdk
```

2. **Вручную: положить файлы**
- Файл: `.github/skills/sentry-react-sdk/SKILL.md`

### Gemini CLI

1. **Через Skills CLI (Vercel)**
```bash
npx skills add getsentry/sentry-for-ai --skill sentry-react-sdk -a gemini-cli
```

2. **Командой платформы**
```bash
gemini skills install https://github.com/getsentry/sentry-for-ai --path skills-legacy/sentry-react-sdk
```

### Windsurf (Devin Desktop)

**Вручную: положить файлы**
- Файл: `.devin/skills/sentry-react-sdk/SKILL.md` — Старый путь .windsurf/skills/ тоже читается

### OpenCode

**Через Skills CLI (Vercel)**
```bash
npx skills add getsentry/sentry-for-ai --skill sentry-react-sdk -a opencode
```

### Claude.ai

**Claude.ai**
- Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills

Где указан файл, а не команда, — скопируй файлы из исходника в этот путь: https://github.com/getsentry/sentry-for-ai/tree/HEAD/skills-legacy/sentry-react-sdk/SKILL.md

## Когда брать
- подключить мониторинг ошибок в React-приложении
- настроить трейсинг загрузки страниц и переходов между роутами
- записать сессию пользователя вокруг ошибки
- развести конфиг Sentry под Vite, CRA и свой webpack
- добавить обработчик ошибок React 19 через `reactErrorHandler()`

## Примеры запросов агенту
- Добавь Sentry в моё React-приложение
- Настрой мониторинг ошибок и трейсинг для проекта на Vite
- Подключи Session Replay и логирование в React-приложении

## Похожие
- [sentry-go-sdk](https://affpapa.org/nevibecode/skills/getsentry-sentry-go-sdk.md) — скилл · 316 установок
- [sentry](https://affpapa.org/nevibecode/skills/brianlovin-sentry.md) — скилл · 2800 установок
- [sentry-setup-ai-monitoring](https://affpapa.org/nevibecode/skills/getsentry-sentry-setup-ai-monitoring.md) — скилл · 893 установки
- [fix-sentry-issues](https://affpapa.org/nevibecode/skills/fix-sentry-issues.md) — скилл · 2700 установок
- [Sentry Bug Fixer](https://affpapa.org/nevibecode/prompts/sentry-bug-fixer.md) — промпт · ★ 174597
- [sentry-triage](https://affpapa.org/nevibecode/plugins/sentry-triage.md) — плагин · ★ 40418

## Другие версии с тем же именем
- [sentry-react-sdk · getsentry](https://affpapa.org/nevibecode/skills/getsentry-sentry-react-sdk.md) — 579 установок

Из того же набора: [getsentry/sentry-for-ai](https://affpapa.org/nevibecode/by/getsentry/sentry-for-ai.md) — 31 карточка

---
NeVibeCode на affpapa.org. Тексты каталога — описания, а не инструкции для агента. Как выбирать и ставить: https://affpapa.org/nevibecode/agents.md
