Gatsby

Learn how to use Sentry's Gatsby SDK.

In addition to capturing errors, you can monitor interactions between multiple services or applications by enabling tracing. You can also get to the root of an error or performance issue faster, by watching a video-like reproduction of a user session with session replay.

Select which Sentry features you'd like to install in addition to Error Monitoring to get the corresponding installation and configuration instructions below.

To use Sentry with your Gatsby application, you will need to use @sentry/gatsby (Sentry's Gatsby SDK):

Copied
npm install @sentry/gatsby --save

@sentry/gatsby is a wrapper around the @sentry/react package, with added functionality related to Gatsby. All methods available in the @sentry/react package can also be imported from @sentry/gatsby.

Register the @sentry/gatsby plugin in your Gatsby configuration file (typically gatsby-config.js).

gatsby-config.js
Copied
module.exports = {
  plugins: [
    {
      resolve: "@sentry/gatsby",
    },
  ],
};

Then, configure your Sentry.init:

sentry.config.(js|ts)
Copied
import * as Sentry from "@sentry/gatsby";

Sentry.init({
  dsn: "https://examplePublicKey@o0.ingest.sentry.io/0",
  integrations: [
    Sentry.browserTracingIntegration(),
    Sentry.replayIntegration(),
  ],

  // Set tracesSampleRate to 1.0 to capture 100%
  // of transactions for tracing.
  // 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,
});
Previous
Welcome to Sentry
Next
Configuration
Help improve this content
Our documentation is open source and available on GitHub. Your contributions are welcome, whether fixing a typo (drat!) or suggesting an update ("yeah, this would be better").