Source maps

See original file names and line numbers in your stack traces.

Install the bundler plugin

terminal

pnpm add -D @observerkit/vite

The plugin uploads source maps on each build and injects debug IDs for accurate stack trace mapping.

Configure

Add the plugin to your Vite config. Source maps are enabled automatically.

vite.config.ts

import { defineConfig } from "vite"
import react from "@vitejs/plugin-react"
import observerkit from "@observerkit/vite"

export default defineConfig({
  plugins: [
    react(),
    observerkit({
      projectKey: "ok_proj_...",
    }),
  ],
})

Options

projectKeystringRequired. Your project key.

endpointstringIngest API URL. Defaults to ingest.observerkit.com.

deleteAfterUploadbooleanRemove .map files from output after upload and strip sourceMappingURL references so nothing dangles. Defaults to true.

Verify

Drop a button into your app that throws, trigger it after a production build, then check your dashboard. The stack trace should show original file names and line numbers.

<button
  onClick={() => {
    throw new Error("test error")
  }}
>
  Throw test error
</button>