feat(tanstackstart-react)!: Export Vite plugin from @sentry/tanstackstart-react/vite subpath (#19182)

Closes #19180
Closes #19181

Context #19142

As discussed we change the `sentryTanstackStart()` vite plugin to now be
a subpath export from `@sentry/tanstackstart-react`. This should resolve
the issue of the plugin being pulled into user builds. As far as I could
see this now seems to work for the latest nitro alpha. With the latest
nitro nightly we still see a `rollup` issue that is a bit annoying.
However, it does work with the latest vite 8 beta, which uses
`rolldown`.

Author: nicohrubec

CHANGELOG.md

@@ -47,6 +47,15 @@ Work in this release was contributed by @LudvigHz and @jadengis. Thank you for y
 
 ### Important Changes
 
+- **feat(tanstackstart-react)!: Export Vite plugin from `@sentry/tanstackstart-react/vite` subpath ([#19182](https://github.com/getsentry/sentry-javascript/pull/19182))**
+
+  The `sentryTanstackStart` Vite plugin is now exported from a dedicated subpath. Update your import:
+
+  ```diff
+  - import { sentryTanstackStart } from '@sentry/tanstackstart-react';
+  + import { sentryTanstackStart } from '@sentry/tanstackstart-react/vite';
+  ```
+
 - **feat(tanstackstart-react): Auto-instrument server function middleware ([#19001](https://github.com/getsentry/sentry-javascript/pull/19001))**
 
   The `sentryTanstackStart` Vite plugin now automatically instruments middleware in `createServerFn().middleware([...])` calls. This captures performance data without requiring manual wrapping with `wrapMiddlewaresWithSentry()`.

dev-packages/e2e-tests/test-applications/tanstackstart-react/package.json

@@ -17,7 +17,8 @@
     "@tanstack/react-start": "^1.136.0",
     "@tanstack/react-router": "^1.136.0",
     "react": "^19.2.0",
-    "react-dom": "^19.2.0"
+    "react-dom": "^19.2.0",
+    "nitro": "latest || *"
   },
   "devDependencies": {
     "@types/react": "^19.2.0",
@@ -29,7 +30,6 @@
     "typescript": "^5.9.0",
     "vite": "7.2.0",
     "vite-tsconfig-paths": "^5.1.4",
-    "nitro": "^3.0.0",
     "@playwright/test": "~1.56.0",
     "@sentry-internal/test-utils": "link:../../../test-utils"
   },

dev-packages/e2e-tests/test-applications/tanstackstart-react/vite.config.ts

@@ -3,23 +3,23 @@ import tsConfigPaths from 'vite-tsconfig-paths';
 import { tanstackStart } from '@tanstack/react-start/plugin/vite';
 import viteReact from '@vitejs/plugin-react-swc';
 import { nitro } from 'nitro/vite';
-import { sentryTanstackStart } from '@sentry/tanstackstart-react';
+import { sentryTanstackStart } from '@sentry/tanstackstart-react/vite';
 
 export default defineConfig({
   server: {
     port: 3000,
   },
   plugins: [
+    tsConfigPaths(),
+    tanstackStart(),
+    nitro(),
+    // react's vite plugin must come after start's vite plugin
+    viteReact(),
     sentryTanstackStart({
       org: process.env.E2E_TEST_SENTRY_ORG_SLUG,
       project: process.env.E2E_TEST_SENTRY_PROJECT,
       authToken: process.env.E2E_TEST_AUTH_TOKEN,
       debug: true,
     }),
-    tsConfigPaths(),
-    tanstackStart(),
-    nitro(),
-    // react's vite plugin must come after start's vite plugin
-    viteReact(),
   ],
 });

packages/tanstackstart-react/package.json

@@ -37,6 +37,11 @@
       "import": {
         "default": "./build/loader-hook.mjs"
       }
+    },
+    "./vite": {
+      "types": "./build/types/vite/index.d.ts",
+      "import": "./build/esm/vite/index.js",
+      "require": "./build/cjs/vite/index.js"
     }
   },
   "typesVersions": {

packages/tanstackstart-react/rollup.npm.config.mjs

@@ -3,7 +3,13 @@ import { makeBaseNPMConfig, makeNPMConfigVariants, makeOtelLoaders } from '@sent
 export default [
   ...makeNPMConfigVariants(
     makeBaseNPMConfig({
-      entrypoints: ['src/index.server.ts', 'src/index.client.ts', 'src/client/index.ts', 'src/server/index.ts'],
+      entrypoints: [
+        'src/index.server.ts',
+        'src/index.client.ts',
+        'src/client/index.ts',
+        'src/server/index.ts',
+        'src/vite/index.ts',
+      ],
     }),
   ),
   ...makeOtelLoaders('./build', 'sentry-node'),

packages/tanstackstart-react/src/index.server.ts

@@ -3,4 +3,3 @@
 export * from './config';
 export * from './server';
 export * from './common';
-export * from './vite';

packages/tanstackstart-react/src/index.types.ts

@@ -12,7 +12,6 @@ export * from './config';
 export * from './client';
 export * from './server';
 export * from './common';
-export * from './vite';
 
 /** Initializes Sentry TanStack Start SDK */
 export declare function init(options: Options | clientSdk.BrowserOptions | serverSdk.NodeOptions): Client | undefined;
@@ -38,5 +37,6 @@ export declare const unleashIntegration: typeof clientSdk.unleashIntegration;
 
 export declare const wrapMiddlewaresWithSentry: typeof serverSdk.wrapMiddlewaresWithSentry;
 
+export declare const tanstackRouterBrowserTracingIntegration: typeof clientSdk.tanstackRouterBrowserTracingIntegration;
 export declare const sentryGlobalRequestMiddleware: typeof serverSdk.sentryGlobalRequestMiddleware;
 export declare const sentryGlobalFunctionMiddleware: typeof serverSdk.sentryGlobalFunctionMiddleware;

packages/tanstackstart-react/src/server/index.ts

@@ -1,13 +1,29 @@
 // import/export got a false positive, and affects most of our index barrel files
 // can be removed once following issue is fixed: https://github.com/import-js/eslint-plugin-import/issues/703
 /* eslint-disable import/export */
+import type { Integration } from '@sentry/core';
+
 export * from '@sentry/node';
 
 export { init } from './sdk';
 export { wrapFetchWithSentry } from './wrapFetchWithSentry';
 export { wrapMiddlewaresWithSentry } from './middleware';
 export { sentryGlobalRequestMiddleware, sentryGlobalFunctionMiddleware } from './globalMiddleware';
 
+/**
+ * A no-op stub of the browser tracing integration for the server. Router setup code is shared between client and server,
+ * so this stub is needed to prevent build errors during SSR bundling.
+ */
+export function tanstackRouterBrowserTracingIntegration(
+  _router: unknown,
+  _options?: Record<string, unknown>,
+): Integration {
+  return {
+    name: 'BrowserTracing',
+    setup() {},
+  };
+}
+
 /**
  * A passthrough error boundary for the server that doesn't depend on any react. Error boundaries don't catch SSR errors
  * so they should simply be a passthrough.

packages/tanstackstart-react/src/vite/sentryTanstackStart.ts

@@ -28,7 +28,7 @@ export interface SentryTanstackStartOptions extends BuildTimeOptionsBase {
  * ```typescript
  * // vite.config.ts
  * import { defineConfig } from 'vite';
- * import { sentryTanstackStart } from '@sentry/tanstackstart-react';
+ * import { sentryTanstackStart } from '@sentry/tanstackstart-react/vite';
  * import { tanstackStart } from '@tanstack/react-start/plugin/vite';
  *
  * export default defineConfig({