← All platforms

TanStack Start React error tracking

Typed routes and server functions still meet unexpected errors. The Sentry TanStack Start SDK sends their reports to Telebugs on your server.

~/hoofnotes  npm install @sentry/tanstackstart-react
~/hoofnotes  nvim instrument.server.mjs src/client.tsx src/start.ts
import * as Sentry from "@sentry/tanstackstart-react";
Sentry.init({
// Copy the complete Telebugs DSN, key and path included.
dsn: "YOUR_TELEBUGS_DSN",
});
import * as Sentry from "@sentry/tanstackstart-react";
Sentry.init({
// Copy the complete Telebugs DSN, key and path included.
dsn: "YOUR_TELEBUGS_DSN",
});
import { createStart } from "@tanstack/react-start";
import {
sentryGlobalRequestMiddleware,
sentryGlobalFunctionMiddleware,
} from "@sentry/tanstackstart-react";
export const startInstance = createStart(() => ({
requestMiddleware: [sentryGlobalRequestMiddleware],
functionMiddleware: [sentryGlobalFunctionMiddleware],
}));
~/hoofnotes  NODE_OPTIONS='--import ./instrument.server.mjs' npm run dev

Hang on, I already use Sentry

Keep @sentry/tanstackstart-react and change its destination to your Telebugs DSN. Your error reports stay on your server. You don’t need a Sentry account.

What about server functions?

The SDK has middleware for server requests and server functions. Their exceptions can go to Telebugs alongside reports from your browser code.

Can my route’s error component report an error?

Yes. Report the exception from your error component, or use a reporting React error boundary. Showing a useful fallback and keeping an error report are separate jobs.

Will I recognize my source code?

Yes. Give Telebugs the matching source maps and it can show your original files and line numbers instead of a minified backtrace.