TanStack Router

Before you start, install the SDK and copy the Project’s DSN as described in the Browser SDK overview. Add your app’s origin to the Project’s allowed origins.

Initialize

src/monitoring.ts

import { init } from "@openrum/browser";

init({
  dsn: import.meta.env.VITE_OPENRUM_DSN,
  environment: import.meta.env.MODE,
  release: import.meta.env.VITE_APP_RELEASE,
});

src/main.tsx

import "./monitoring.ts";
import { createRouter } from "@tanstack/react-router";

TanStack Router commits navigations through history.pushState, so each one produces a Page View. The recorded Route is the resolved pathname, not the route pattern: /orders/8fc1 rather than /orders/$orderId. See Route patterns.

Next steps

• Verify that capture, ingest and aggregation agree.
• For Vite builds, the React (Vite) Source Map page shows the plugin setup.