diff --git a/docs/platforms/javascript/guides/react-router/index.mdx b/docs/platforms/javascript/guides/react-router/index.mdx index 1feab0cfe53d6..571b2de787d1c 100644 --- a/docs/platforms/javascript/guides/react-router/index.mdx +++ b/docs/platforms/javascript/guides/react-router/index.mdx @@ -172,6 +172,44 @@ export function ErrorBoundary({ error }: Route.ErrorBoundaryProps) { ### Server-Side Setup + + Automatic server-side instrumentation is currently only supported on: + - **Node 20:** Version \<20.19 + - **Node 22:** Version \<22.12 + + + If you are on a different version please make use of our manual server wrappers. + + For server loaders use `wrapServerLoader`: +```ts +import * as Sentry from '@sentry/react-router'; + +export const loader = Sentry.wrapServerLoader( + { + name: 'Load Some Data', + description: 'Loads some data from the db', + }, + async ({ params }) => { + // ... your loader logic + } +); +``` + For server actions use `wrapServerAction`: +```ts +import * as Sentry from '@sentry/react-router'; + +export const action = Sentry.wrapServerAction( + { + name: 'Submit Form Data', + description: 'Processes form submission data', + }, + async ({ request }) => { + // ... your action logic + } +); +``` + + Create an `instrument.server.mjs` file in the root of your app: ```js {filename: instrument.server.mjs}