@sentry/astro

Official Sentry SDK for Astro

Links

• Official SDK Docs

Experimental Note

This SDK is experimental and in Alpha state. Breaking changes can occurr at any time. If you have feedback or encounter any bugs, feel free to open an issue.

General

This package is a wrapper around @sentry/node for the server and @sentry/browser for the client side.

Installation and Setup

Install the Sentry Astro SDK with the astro CLI:

npx astro add @sentry/astro

Add your DSN and source maps upload configuration:

import { defineConfig } from "astro/config";
import sentry from "@sentry/astro";

export default defineConfig({
  integrations: [
    sentry({
      dsn: "__DSN__",
      sourceMapsUploadOptions: {
        project: "your-sentry-project-slug",
        authToken: process.env.SENTRY_AUTH_TOKEN,
      },
    }),
  ],
});

Follow this guide to create an auth token and add it to your environment variables:

SENTRY_AUTH_TOKEN="your-token"

Complete the setup by adding the Sentry middleware to your src/middleware.js file:

// src/middleware.js
import { sequence } from "astro:middleware";
import * as Sentry from "@sentry/astro";

export const onRequest = sequence(
  Sentry.handleRequest(),
  // Add your other handlers after Sentry.handleRequest()
);

This middleware creates server-side spans to monitor performance on the server for page load and endpoint requests.

Configuration

Check out our docs for configuring your SDK setup:

• Getting Started
• Manual Setup and Configuration
• Source Maps Upload