SuperAPI AI 工具集

sentry-react-setup

前端与建站

查看项目

更新于 10-15 21:51

技能介绍

用途:在 React 项目中安装并配置 Sentry,用于错误监控、日志与追踪。适用于用户要求为 React 添加 Sentry、安装 @sentry/react,或配置错误边界、会话回放等场景。

主要能力:安装 @sentry/react;初始化 SDK(DSN、sendDefaultPii、browserTracingIntegration、replayIntegration、tracesSampleRate、tracePropagationTargets、replaysSessionSampleRate、replaysOnErrorSampleRate、enableLogs);错误处理(React 19+ 使用 createRoot 的 onUncaughtError/onCaughtError/onRecoverableError 配合 Sentry.reactErrorHandler(),React <19 使用 Sentry.ErrorBoundary);路由集成(React Router v7/v6/v5、TanStack Router);可选 Redux 集成(Sentry.createReduxEnhancer());Source Maps 上传。

使用方式:安装命令 npm install @sentry/react --save。在项目根目录创建 instrument.js 并确保在应用入口最先导入(如 src/index.js 或 src/main.jsx 中 import "./instrument" 置于首位)。环境变量:SDK 自动读取 SENTRY_DSN;Create React App 需加 REACT_APP_ 前缀,Vite 用 VITE_ 前缀;SENTRY_AUTH_TOKEN、SENTRY_ORG、SENTRY_PROJECT 供 sentry-cli 上传 Source Maps 使用,浏览器 SDK 不读取。上传 Source Maps 命令:npx @sentry/wizard@latest -i sourcemaps。验证可添加触发错误的测试按钮。

限制:资料明确提示配置选项与代码示例仅为示例,实施前须对照 docs.sentry.io 核实,API 与默认值可能已变化。资料未提供收费、价格、平台支持范围等信息。