diff --git a/docs/platforms/javascript/guides/nextjs/manual-setup.mdx b/docs/platforms/javascript/guides/nextjs/manual-setup.mdx index f7ef7a32be748..e6ccb816f6855 100644 --- a/docs/platforms/javascript/guides/nextjs/manual-setup.mdx +++ b/docs/platforms/javascript/guides/nextjs/manual-setup.mdx @@ -67,13 +67,14 @@ export default withSentryConfig(nextConfig, { ``` ### Extend Sentry Webpack Plugin Options + `withSentryConfig` uses a [custom Webpack plugin](https://www.npmjs.com/package/@sentry/webpack-plugin) to manage your sourcemaps and releases under the hood. If `withSentryConfig` does not provide the option you need to modify, you may override the `sentryWebpackPluginOptions` directly via `unstable_sentryWebpackPluginOptions`. - Note that this option is unstable and its API may include breaking changes in any release. + Note that this option is unstable and its API may include breaking changes in + any release. - ## Create Initialization Config Files Create three files in the root directory of your Next.js application: `sentry.client.config.js`, `sentry.server.config.js` and `sentry.edge.config.js`. In these files, add your initialization code for the client-side SDK and server-side SDK, respectively. We've included some examples below. @@ -175,7 +176,6 @@ export async function register() { } ``` - Make sure that the `import` statements point to your newly created `sentry.server.config.(js|ts)` and `sentry.edge.config.(js|ts)` files. ## Report React Component Render Errors @@ -239,53 +239,6 @@ export default function GlobalError({ error }) { } ``` -Note that if you create [Next.js error.js files](https://nextjs.org/docs/app/building-your-application/routing/error-handling), these files will take precedence over the `global-error.js` file. -This means, that if you want to report errors that are caught by `error.js` files, you need to manually capture them: - -```tsx {filename:error.tsx} -"use client"; - -import { useEffect } from "react"; -import * as Sentry from "@sentry/nextjs"; - -export default function ErrorPage({ - error, -}: { - error: Error & { digest?: string }; -}) { - useEffect(() => { - // Log the error to Sentry - Sentry.captureException(error); - }, [error]); - - return ( -
-

Something went wrong!

-
- ); -} -``` - -```jsx {filename:error.jsx} -"use client"; - -import { useEffect } from "react"; -import * as Sentry from "@sentry/nextjs"; - -export default function ErrorPage({ error }) { - useEffect(() => { - // Log the error to Sentry - Sentry.captureException(error); - }, [error]); - - return ( -
-

Something went wrong!

-
- ); -} -``` - #### Errors from Nested React Server Components _Requires `@sentry/nextjs` version `8.28.0` or higher and Next.js 15._ diff --git a/platform-includes/capture-error/javascript.nextjs.mdx b/platform-includes/capture-error/javascript.nextjs.mdx index bd719fc8f9266..b262d0650a90d 100644 --- a/platform-includes/capture-error/javascript.nextjs.mdx +++ b/platform-includes/capture-error/javascript.nextjs.mdx @@ -9,3 +9,52 @@ try { Sentry.captureException(err); } ``` + +### Capturing Errors in `error.js` Files + +Note that if you create [Next.js error.js files](https://nextjs.org/docs/app/building-your-application/routing/error-handling), these files will take precedence over any global error handling. +This means, that if you want to report errors that are caught by `error.js` files, you need to manually capture them: + +```tsx {filename:error.tsx} +"use client"; + +import { useEffect } from "react"; +import * as Sentry from "@sentry/nextjs"; + +export default function ErrorPage({ + error, +}: { + error: Error & { digest?: string }; +}) { + useEffect(() => { + // Log the error to Sentry + Sentry.captureException(error); + }, [error]); + + return ( +
+

Something went wrong!

+
+ ); +} +``` + +```jsx {filename:error.jsx} +"use client"; + +import { useEffect } from "react"; +import * as Sentry from "@sentry/nextjs"; + +export default function ErrorPage({ error }) { + useEffect(() => { + // Log the error to Sentry + Sentry.captureException(error); + }, [error]); + + return ( +
+

Something went wrong!

+
+ ); +} +```