Cloudflare Remix Framework Guide

If you're running your Remix app on Cloudflare Pages, you can use the Sentry Remix SDK in combination with the Sentry Cloudflare SDK to add Sentry instrumentation.

First, install the Sentry Remix SDK in your application. We recommend using the Sentry wizard to automatically install the SDK:

npx @sentry/wizard@latest -i remix

If the setup through the wizard doesn't work for you, you can also set up the Remix SDK manually.

After installing the Sentry Remix SDK, delete the newly generated instrumentation.server.mjs file. This instrumentation is not needed when using the Cloudflare SDK.

Now you can install the Sentry Cloudflare SDK. First, install the SDK with your package manager:

npm install @sentry/cloudflare --save

To use the SDK, you'll need to set either the nodejs_compat or nodejs_als compatibility flags in your wrangler.toml. This is because the SDK needs access to the AsyncLocalStorage API to work correctly.

compatibility_flags = ["nodejs_compat"]
# compatibility_flags = ["nodejs_als"]

Then create a _middleware.js file in your functions directory and add the following code:

import * as Sentry from "@sentry/cloudflare";

export const onRequest = [
  // Make sure Sentry is the first middleware
  Sentry.sentryPagesPlugin((context) => ({
    dsn: "https://examplePublicKey@o0.ingest.sentry.io/0",
    // Set tracesSampleRate to 1.0 to capture 100% of spans for tracing.
    tracesSampleRate: 1.0,
  })),
  // Add more middlewares here
];