Integrations

Learn more about how integrations extend the functionality of our SDK to cover common libraries and environments automatically.

The Sentry SDK uses integrations to hook into the functionality of popular libraries to automatically instrument your application and give you the best data out of the box.

Integrations automatically add error instrumentation, performance instrumentation, and/or extra context information to your application. Some are enabled by default, but you can disable them or modify their settings.

The Remix SDK initializes the SDK in two runtimes: Browser and Node.js. However, it's important to note that not all integrations are compatible with all of these runtimes.

Depending on whether an integration enhances the functionality of a particular runtime, such as the BrowserTracing integration for the browser runtime or the RequestData integration for the Node.js.js runtime, you can only include these integrations in their respective configuration files:

  • For the browser runtime integrations, add integrations to Sentry.init in entry.client.tsx
  • For the Node.js runtime integrations, add integrations to Sentry.init in entry.server.tsx

Auto EnabledErrorsPerformanceAdditional Context
dedupeIntegration
functionToStringIntegration
inboundFiltersIntegration
linkedErrorsIntegration
captureConsoleIntegration
debugIntegration
extraErrorDataIntegration
rewriteFramesIntegration
sessionTimingIntegration

Auto EnabledErrorsPerformanceReplayAdditional Context
breadcrumbsIntegration
browserApiErrorsIntegration
browserTracingIntegration
globalHandlersIntegration
httpContextIntegration
browserProfilingIntegration
contextLinesIntegration
httpClientIntegration
moduleMetadataIntegration
replayIntegration
replayCanvasIntegration
reportingObserverIntegration

Auto EnabledErrorsPerformanceAdditional Context
amqplib
consoleIntegration
contextLinesIntegration
httpIntegration
genericPoolIntegration
graphqlIntegration
kafkaIntegration
modulesIntegration
mongoIntegration
mongooseIntegration
mysqlIntegration
mysql2Integration
nodeContextIntegration
nativeNodeFetchIntegration
onUncaughtExceptionIntegration
onUnhandledRejectionIntegration
postgresIntegration
prismaIntegration
redisIntegration
requestDataIntegration
anrIntegration
localVariablesIntegration
nodeProfilingIntegration
fsIntegration
trpcMiddleware

To disable system integrations, set defaultIntegrations: false when calling init().

To override their settings, provide a new instance with your config to the integrations option. For example, to turn off browser capturing console calls:

Copied
Sentry.init({
  dsn: "https://examplePublicKey@o0.ingest.sentry.io/0",

  integrations: [
    Sentry.linkedErrorsIntegration({
      limit: 7,
    }),
  ],
});

You can add additional integrations in your init call:

Copied
import * as Sentry from "@sentry/browser";

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

Alternatively, you can add integrations via Sentry.addIntegration(). This is useful if you only want to enable an integration in a specific environment or if you want to load an integration later. For all other cases, we recommend you use the integrations option.

Copied
import * as Sentry from "@sentry/browser";

Sentry.init({
  integrations: [],
});

Sentry.addIntegration(Sentry.reportingObserverIntegration());

Lazy-loading lets you add pluggable integrations without increasing the initial bundle size. You can do this in two ways:

You can add the integration with a dynamic import using import(). This method loads the integration from the npm package. To avoid running into issues with import(), you should use a bundler that supports dynamic imports. If you're using a tool like Vite for your project, the bundling process is probably already set up.

Copied
Sentry.init({
  // Note, Replay is NOT instantiated below:
  integrations: [],
});

// Sometime later
import("@sentry/remix").then((lazyLoadedSentry) => {
  Sentry.addIntegration(lazyLoadedSentry.replayIntegration());
});

You can also lazy-load pluggable integrations via Sentry.lazyLoadIntegration(). This will attempt to load the integration from the Sentry CDN. Note that this function will reject if it fails to load the integration from the Sentry CDN, which can happen if a user has an ad-blocker or if there's a network problem. You should always make sure that rejections are handled for this function in your application.

Copied
async function loadHttpClient() {
  const httpClientIntegration = await Sentry.lazyLoadIntegration(
    "httpClientIntegration",
  );
  Sentry.addIntegration(httpClientIntegration());
}

Lazy loading is available for the following integrations:

  • replayIntegration
  • replayCanvasIntegration
  • feedbackIntegration
  • feedbackModalIntegration
  • feedbackScreenshotIntegration
  • captureConsoleIntegration
  • contextLinesIntegration
  • linkedErrorsIntegration
  • debugIntegration
  • dedupeIntegration
  • extraErrorDataIntegration
  • httpClientIntegration
  • reportingObserverIntegration
  • rewriteFramesIntegration
  • sessionTimingIntegration
  • browserProfilingIntegration

If you only want to remove a single or some of the default integrations, instead of disabling all of them with defaultIntegrations: false, you can use the following syntax to filter out the ones you don't want.

This example removes the integration for adding breadcrumbs to the event, which is enabled by default:

Copied
Sentry.init({
  // ...
  integrations: function (integrations) {
    // integrations will be all default integrations
    return integrations.filter(function (integration) {
      return integration.name !== "Breadcrumbs";
    });
  },
});

You can also create custom integrations.

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").