Sentry for TanStack Start React

Learn how to set up and configure Sentry in your TanStack Start React application using the installation wizard, capturing your first errors, and viewing them in Sentry.

Agent-Assisted Setup
Use curl to download, read and follow https://skills.sentry.dev/instrument to set up the Sentry TanStack Start SDK.
Your agent will set up Sentry in your TanStack Start app automatically. Works with Cursor, Claude Code, Codex, and more.View docs ↗
Install the full plugin

Install the Sentry plugin to give your assistant every skill. See the installation docs for more details.

Copied
npx @sentry/agent-plugin install

You need:

Run the Sentry init command in your project directory to automatically configure Sentry in your TanStack Start React application.

The command guides you through setup and asks which optional Sentry features you want to enable beyond error monitoring.

Copied
npx sentry@latest init
How does sentry init work?

The sentry init command is AI-powered. It analyzes your project and generates a tailored integration, rather than applying a fixed template. Here's what it does:

  • Analyzes your project — reads project files and manifests to understand your TanStack Start React app structure, including monorepos. It also respects AI instruction files such as CLAUDE.md, AGENTS.md, and .cursorrules.
  • Detects your framework — identifies TanStack Start and selects the @sentry/tanstackstart-react SDK.
  • Fetches official Sentry docs — uses the current Sentry documentation as the source of truth when generating integration code.
  • Installs dependencies — adds @sentry/tanstackstart-react using your project's package manager.
  • Creates and modifies files — sets up client-side and server-side initialization, the Vite plugin for source maps, the server entry point, and middleware based on your project structure.
  • Verifies the integration — re-reads modified files after writing to confirm Sentry was integrated.

For full details on what each file does, see the Manual Setup guide.

By default, the SDK sends user identity data (IP address, ID, and similar) and other data like HTTP bodies and URL query parameters. This will give you rich debugging context.

The SDK always filters sensitive values whose keys match a built-in denylist, such as auth or password, and sends [Filtered] instead.

To send less data, turn off the categories you don't need in the dataCollection option. For the full list of categories and their defaults, see the dataCollection options.

Copied
Sentry.init({
  dsn: "___PUBLIC_DSN___",

  dataCollection: {
    userInfo: false,
    // other categories

  },
});

The wizard will have prompted you to select which features to enable. Select the same options here to see the relevant verification steps:

Add a test button to one of your pages to trigger an error:

Copied
<button
  type="button"
  onClick={() => {
    throw new Error("Sentry Test Error");
  }}
>
  Break the world
</button>;

Start your dev server and click the button.

Errors — Open Issues

You should see "Sentry Test Error" with a full stack trace pointing to your source code.

Tracing — Open Traces

You should see page load and navigation traces. Learn more about custom spans.

Session Replay — Open Replays

Watch a video-like recording of your session, including the moment the error occurred. Learn more about Session Replay configuration.

Logs — Open Logs

See structured log entries from your application. You can send logs from anywhere:

Copied
Sentry.logger.info("User action", { userId: "123" });
Sentry.logger.warn("Slow response", { duration: 5000 });
Sentry.logger.error("Operation failed", { reason: "timeout" });

Learn more about Logs configuration.

Application Metrics — Open Metrics NEW

Track and analyze custom application metrics to understand trends and patterns in your app's performance and behavior over time:

Copied
Sentry.metrics.count("checkout.failed", 1);
Sentry.metrics.gauge("queue.depth", 42);
Sentry.metrics.distribution("api_latency", 187, {
  unit: "millisecond",
});

Learn more about Application Metrics.

Are you having problems setting up the SDK?

You've successfully integrated Sentry into your TanStack Start React application! Here's what to explore next:

Previous
Welcome to Sentry
Next
Manual Setup
Was this helpful?
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").