Migrate to Netlify Today

Netlify announces the next evolution of Gatsby Cloud. Learn more

ContactSign Up
Community Plugin
View plugin on GitHub

Sentry

Official Sentry SDK for GatsbyJS

First register the package as a plugin in gatsby-config.js:

module.exports = {
  // ...
  plugins: [
    {
      resolve: '@sentry/gatsby',
      options: {
        dsn: process.env.SENTRY_DSN, // this is the default
      },
    },
    // ...
  ],
};

Then configure your Sentry.init call:

import * as Sentry from '@sentry/gatsby';

Sentry.init({
  dsn: '__PUBLIC_DSN__',
  integrations: [Sentry.browserTracingIntegration(), Sentry.replayIntegration()],

  // Set tracesSampleRate to 1.0 to capture 100%
  // of transactions for performance monitoring.
  // We recommend adjusting this value in production
  tracesSampleRate: 1.0,

  // Capture Replay for 10% of all sessions,
  // plus for 100% of sessions with an error
  replaysSessionSampleRate: 0.1,
  replaysOnErrorSampleRate: 1.0,

  // Set `tracePropagationTargets` to control for which URLs distributed tracing should be enabled
  tracePropagationTargets: ['localhost', /^https:\/\/yourserver\.io\/api/],
});

The Gatsby SDK also automatically sets up sourcemaps uploading for you. To disable this functionality, set the enableClientWebpackPlugin option to be false.

module.exports = {
  // ...
  plugins: [
    {
      resolve: '@sentry/gatsby',
      options: {
        enableClientWebpackPlugin: false,
      },
    },
    // ...
  ],
};
© 2024 Gatsby, Inc.