What is @sentry/nextjs?
The @sentry/nextjs package is a JavaScript SDK for Sentry that provides error tracking and performance monitoring specifically tailored for Next.js applications. It helps developers to automatically capture exceptions, track performance issues, and improve the reliability of their Next.js applications.
What are @sentry/nextjs's main functionalities?
Automatic Error Tracking
Automatically captures unhandled exceptions and errors in the Next.js application and sends them to Sentry for monitoring and analysis.
import * as Sentry from '@sentry/nextjs';
Sentry.init({ dsn: 'YOUR_DSN' });
Performance Monitoring
Enables performance monitoring to track the performance of server-side and client-side Next.js operations, providing insights into slow transactions and bottlenecks.
import * as Sentry from '@sentry/nextjs';
Sentry.init({
dsn: 'YOUR_DSN',
tracesSampleRate: 1.0
});
Custom Error Reporting
Allows developers to manually report custom errors or exceptions to Sentry, giving them control over what gets reported.
import * as Sentry from '@sentry/nextjs';
Sentry.captureException(new Error('Custom error message'));
Release Health Tracking
Tracks the health of releases by monitoring error rates and issues that affect end-users, helping developers to understand the impact of new releases.
import * as Sentry from '@sentry/nextjs';
Sentry.init({
dsn: 'YOUR_DSN',
release: 'my-project-name@1.0.0'
});
Other packages similar to @sentry/nextjs
bugsnag-js
Bugsnag provides error monitoring for JavaScript applications, including Next.js. It offers similar features to Sentry, such as automatic error detection, custom error reporting, and release tracking. However, Bugsnag's interface and integrations may differ from Sentry's.
raygun4js
Raygun offers real-time error tracking and crash reporting for JavaScript applications. It includes features like user tracking, performance monitoring, and deployment tracking. Raygun's focus on user-centric metrics and detailed diagnostics provides a different perspective compared to Sentry.
logrocket
LogRocket is a frontend application monitoring solution that combines session replay, performance monitoring, and error tracking. Unlike Sentry, which focuses on error and performance data, LogRocket provides insights into user interactions and experiences by recording user sessions.
Official Sentry SDK for Next.js
Links
Compatibility
Currently, the minimum Next.js supported version is 11.2.0
.
General
This package is a wrapper around @sentry/node
for the server and @sentry/react
for the client, with added
functionality related to Next.js.
To use this SDK, initialize it in the Next.js configuration, in the sentry.client.config.ts|js
file, and in the
Next.js Instrumentation Hook
(instrumentation.ts|js
).
const { withSentryConfig } = require('@sentry/nextjs');
const nextConfig = {
experimental: {
instrumentationHook: true,
},
};
module.exports = withSentryConfig(nextConfig);
import * as Sentry from '@sentry/nextjs';
Sentry.init({
dsn: '__DSN__',
});
import * as Sentry from '@sentry/nextjs';
export function register() {
if (process.env.NEXT_RUNTIME === 'nodejs') {
Sentry.init({
dsn: '__DSN__',
});
}
if (process.env.NEXT_RUNTIME === 'edge') {
Sentry.init({
dsn: '__DSN__',
});
}
}
To set context information or send manual events, use the exported functions of @sentry/nextjs
.
import * as Sentry from '@sentry/nextjs';
Sentry.setExtra('battery', 0.7);
Sentry.setTag('user_mode', 'admin');
Sentry.setUser({ id: '4711' });
Sentry.addBreadcrumb({
message: 'My Breadcrumb',
});
Sentry.captureMessage('Hello, world!');
Sentry.captureException(new Error('Good bye'));
Sentry.captureEvent({
message: 'Manual',
stacktrace: [
],
});
8.12.0
Important Changes
- feat(solid): Remove need to pass router hooks to solid integration (breaking)
This release introduces breaking changes to the @sentry/solid
package (which is currently out in alpha).
We've made it easier to get started with the solid router integration by removing the need to pass use* hooks
explicitly to solidRouterBrowserTracingIntegration
. Import solidRouterBrowserTracingIntegration
from
@sentry/solid/solidrouter
and add it to Sentry.init
import * as Sentry from '@sentry/solid';
import { solidRouterBrowserTracingIntegration, withSentryRouterRouting } from '@sentry/solid/solidrouter';
import { Router } from '@solidjs/router';
Sentry.init({
dsn: '__PUBLIC_DSN__',
integrations: [solidRouterBrowserTracingIntegration()],
tracesSampleRate: 1.0, // Capture 100% of the transactions
});
const SentryRouter = withSentryRouterRouting(Router);
- feat(core): Return client from init method (#12585)
Sentry.init()
now returns a client directly, so you don't need to explicitly call getClient()
anymore:
const client = Sentry.init();
- feat(nextjs): Add
deleteSourcemapsAfterUpload
option (#12457)
This adds an easy way to delete sourcemaps immediately after uploading them:
module.exports = withSentryConfig(nextConfig, {
sourcemaps: {
deleteSourcemapsAfterUpload: true,
},
});
- feat(node): Allow to configure
maxSpanWaitDuration
(#12610)
Adds configuration option for the max. duration in seconds that the SDK will wait for parent spans to be finished before
discarding a span. The SDK will automatically clean up spans that have no finished parent after this duration. This is
necessary to prevent memory leaks in case of parent spans that are never finished or otherwise dropped/missing. However,
if you have very long-running spans in your application, a shorter duration might cause spans to be discarded too early.
In this case, you can increase this duration to a value that fits your expected data.
Other Changes
- feat(feedback): Extra check for iPad in screenshot support (#12593)
- fix(bundle): Ensure CDN bundles do not overwrite
window.Sentry
(#12580) - fix(feedback): Inject preact from feedbackModal into feedbackScreenshot integration (#12535)
- fix(node): Re-throw errors from koa middleware (#12609)
- fix(remix): Mark
isRemixV2
as optional in exposed types. (#12614) - ref(node): Add error message to NodeFetch log (#12612)
Work in this release was contributed by @n4bb12. Thank you for your contribution!