fix: init sentry earlier (#764)

and only add the tracing plugin that needs access to the router later

Co-authored-by: Sarah Gerrard <gerrardsarah@gmail.com>

Author: TkDodo

src/router.tsx

@@ -6,6 +6,21 @@ import { NotFound } from './components/NotFound'
 import { QueryClient } from '@tanstack/react-query'
 import * as Sentry from '@sentry/tanstackstart-react'
 
+if (typeof document !== 'undefined') {
+  Sentry.init({
+    dsn: 'https://ac4bfc43ff4a892f8dc7053c4a50d92f@o4507236158537728.ingest.us.sentry.io/4507236163649536',
+    integrations: [Sentry.replayIntegration()],
+    sendDefaultPii: true,
+    // Performance Monitoring
+    tracesSampleRate: 1.0, //  Capture 100% of the transactions
+    // Set 'tracePropagationTargets' to control for which URLs distributed tracing should be enabled
+    tracePropagationTargets: ['localhost', /^https:\/\/tanstack\.com\//],
+    // Session Replay
+    replaysSessionSampleRate: 0.1, // This sets the sample rate at 10%. You may want to change it to 100% while in development and then sample at a lower rate in production.
+    replaysOnErrorSampleRate: 1.0, // If you're not already sampling the entire session, change the sample rate to 100% when sampling sessions where errors occur.
+  })
+}
+
 export function getRouter() {
   const queryClient: QueryClient = new QueryClient({
     defaultOptions: {
@@ -29,26 +44,15 @@ export function getRouter() {
     },
     scrollToTopSelectors: ['.scroll-to-top'],
   })
-  setupRouterSsrQueryIntegration({ router, queryClient })
 
   if (!router.isServer) {
-    Sentry.init({
-      dsn: 'https://ac4bfc43ff4a892f8dc7053c4a50d92f@o4507236158537728.ingest.us.sentry.io/4507236163649536',
-      integrations: [
-        Sentry.browserTracingIntegration(),
-        Sentry.replayIntegration(),
-      ],
-      sendDefaultPii: true,
-      // Performance Monitoring
-      tracesSampleRate: 1.0, //  Capture 100% of the transactions
-      // Set 'tracePropagationTargets' to control for which URLs distributed tracing should be enabled
-      tracePropagationTargets: ['localhost', /^https:\/\/tanstack\.com\//],
-      // Session Replay
-      replaysSessionSampleRate: 0.1, // This sets the sample rate at 10%. You may want to change it to 100% while in development and then sample at a lower rate in production.
-      replaysOnErrorSampleRate: 1.0, // If you're not already sampling the entire session, change the sample rate to 100% when sampling sessions where errors occur.
-    })
+    Sentry.addIntegration(
+      Sentry.tanstackRouterBrowserTracingIntegration(router),
+    )
   }
 
+  setupRouterSsrQueryIntegration({ router, queryClient })
+
   return router
 }