markdown-body entry-content container-lg" itemprop="text">

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,
      },
    },
    // ...
  ],
};

Additionally, you can delete source map files after they have been uploaded by setting the deleteSourcemapsAfterUpload option to be true.

module.exports = {
  // ...
  plugins: [
    {
      resolve: '@sentry/gatsby',
      options: {
        deleteSourcemapsAfterUpload: true,
      },
    },
    // ...
  ],
};

Official Sentry SDK for GatsbyJS

Links

Uh oh!