feat(tanstackstart-react): Auto-instrument global middleware

CHANGELOG.md

@@ -4,6 +4,24 @@
 
 - "You miss 100 percent of the chances you don't take. — Wayne Gretzky" — Michael Scott
 
+- **feat(tanstackstart-react): Auto-instrument global middleware in `sentryTanstackStart` Vite plugin ([#18884](https://github.com/getsentry/sentry-javascript/pull/18844))**
+
+ The `sentryTanstackStart` Vite plugin now automatically instruments `requestMiddleware` and `functionMiddleware` arrays in `createStart()`. This captures performance data without requiring manual wrapping.
+
+ Auto-instrumentation is enabled by default. To disable it:
+
+ ```ts
+ // vite.config.ts
+ sentryTanstackStart({
+ authToken: process.env.SENTRY_AUTH_TOKEN,
+ org: 'your-org',
+ project: 'your-project',
+ autoInstrumentMiddleware: false,
+ });
+ ```
+
+### Other Changes
+
 ## 10.36.0
 
 - feat(node): Add Prisma v7 support ([#18908](https://github.com/getsentry/sentry-javascript/pull/18908))

dev-packages/e2e-tests/test-applications/tanstackstart-react/src/middleware.ts

@@ -2,13 +2,15 @@ import { createMiddleware } from '@tanstack/react-start';
 import { wrapMiddlewaresWithSentry } from '@sentry/tanstackstart-react';
 
 // Global request middleware - runs on every request
-const globalRequestMiddleware = createMiddleware().server(async ({ next }) => {
+// NOTE: This is exported unwrapped to test auto-instrumentation via the Vite plugin
+export const globalRequestMiddleware = createMiddleware().server(async ({ next }) => {
  console.log('Global request middleware executed');
  return next();
 });
 
 // Global function middleware - runs on every server function
-const globalFunctionMiddleware = createMiddleware({ type: 'function' }).server(async ({ next }) => {
+// NOTE: This is exported unwrapped to test auto-instrumentation via the Vite plugin
+export const globalFunctionMiddleware = createMiddleware({ type: 'function' }).server(async ({ next }) => {
  console.log('Global function middleware executed');
  return next();
 });
@@ -37,17 +39,13 @@ const errorMiddleware = createMiddleware({ type: 'function' }).server(async () =
  throw new Error('Middleware Error Test');
 });
 
-// Manually wrap middlewares with Sentry
+// Manually wrap middlewares with Sentry (for middlewares that won't be auto-instrumented)
 export const [
- wrappedGlobalRequestMiddleware,
- wrappedGlobalFunctionMiddleware,
  wrappedServerFnMiddleware,
  wrappedServerRouteRequestMiddleware,
  wrappedEarlyReturnMiddleware,
  wrappedErrorMiddleware,
 ] = wrapMiddlewaresWithSentry({
- globalRequestMiddleware,
- globalFunctionMiddleware,
  serverFnMiddleware,
  serverRouteRequestMiddleware,
  earlyReturnMiddleware,

dev-packages/e2e-tests/test-applications/tanstackstart-react/src/start.ts

@@ -1,9 +1,10 @@
 import { createStart } from '@tanstack/react-start';
-import { wrappedGlobalRequestMiddleware, wrappedGlobalFunctionMiddleware } from './middleware';
+// NOTE: These are NOT wrapped - auto-instrumentation via the Vite plugin will wrap them
+import { globalRequestMiddleware, globalFunctionMiddleware } from './middleware';
 
 export const startInstance = createStart(() => {
  return {
- requestMiddleware: [wrappedGlobalRequestMiddleware],
- functionMiddleware: [wrappedGlobalFunctionMiddleware],
+ requestMiddleware: [globalRequestMiddleware],
+ functionMiddleware: [globalFunctionMiddleware],
  };
 });

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

@@ -0,0 +1,119 @@
+import type { Plugin } from 'vite';
+
+type AutoInstrumentMiddlewareOptions = {
+ enabled?: boolean;
+ debug?: boolean;
+};
+
+/**
+ * A Vite plugin that automatically instruments TanStack Start middlewares
+ * by wrapping `requestMiddleware` and `functionMiddleware` arrays in `createStart()`.
+ */
+export function makeAutoInstrumentMiddlewarePlugin(options: AutoInstrumentMiddlewareOptions = {}): Plugin {
+ const { enabled = true, debug = false } = options;
+
+ return {
+ name: 'sentry-tanstack-middleware-auto-instrument',
+ enforce: 'pre',
+
+ transform(code, id) {
+ if (!enabled) {
+ return null;
+ }
+
+ // Skip if not a TS/JS file
+ if (!/\.(ts|tsx|js|jsx|mjs|mts)$/.test(id)) {
+ return null;
+ }
+
+ // Only wrap requestMiddleware and functionMiddleware in createStart()
+ // createStart() should always be in a file named start.ts
+ if (!id.includes('start') || !code.includes('createStart(')) {
+ return null;
+ }
+
+ // Skip if the user already did some manual wrapping
+ if (code.includes('wrapMiddlewaresWithSentry')) {
+ return null;
+ }
+
+ let transformed = code;
+ let needsImport = false;
+ const skippedMiddlewares: string[] = [];
+
+ transformed = transformed.replace(
+ /(requestMiddleware|functionMiddleware)\s*:\s*\[([^\]]*)\]/g,
+ (match: string, key: string, contents: string) => {
+ const objContents = arrayToObjectShorthand(contents);
+ if (objContents) {
+ needsImport = true;
+ if (debug) {
+ // eslint-disable-next-line no-console
+ console.log(`[Sentry] Auto-wrapping ${key} in ${id}`);
+ }
+ return `${key}: wrapMiddlewaresWithSentry(${objContents})`;
+ }
+ // Track middlewares that couldn't be auto-wrapped
+ // Skip if we matched whitespace only
+ if (contents.trim()) {
+ skippedMiddlewares.push(key);
+ }
+ return match;
+ },
+ );
+
+ // Warn about middlewares that couldn't be auto-wrapped
+ if (skippedMiddlewares.length > 0) {
+ // eslint-disable-next-line no-console
+ console.warn(
+ `[Sentry] Could not auto-instrument ${skippedMiddlewares.join(' and ')} in ${id}. ` +
+ 'To instrument these middlewares, use wrapMiddlewaresWithSentry() manually. ',
+ );
+ }
+
+ // We didn't wrap any middlewares, so we don't need to import the wrapMiddlewaresWithSentry function
+ if (!needsImport) {
+ return null;
+ }
+
+ const sentryImport = "import { wrapMiddlewaresWithSentry } from '@sentry/tanstackstart-react';\n";
+
+ // Check for 'use server' or 'use client' directives, these need to be before any imports
+ const directiveMatch = transformed.match(/^(['"])use (client|server)\1;?\s*\n?/);
+ if (directiveMatch) {
+ // Insert import after the directive
+ const directive = directiveMatch[0];
+ transformed = directive + sentryImport + transformed.slice(directive.length);
+ } else {
+ transformed = sentryImport + transformed;
+ }
+
+ return { code: transformed, map: null };
+ },
+ };
+}
+
+/**
+ * Convert array contents to object shorthand syntax.
+ * e.g., "foo, bar, baz" → "{ foo, bar, baz }"
+ *
+ * Returns null if contents contain non-identifier expressions (function calls, etc.)
+ * which cannot be converted to object shorthand.
+ */
+export function arrayToObjectShorthand(contents: string): string | null {
+ const items = contents
+ .split(',')
+ .map(s => s.trim())
+ .filter(Boolean);
+
+ // Only convert if all items are valid identifiers (no complex expressions)
+ const allIdentifiers = items.every(item => /^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(item));
+ if (!allIdentifiers || items.length === 0) {
+ return null;
+ }
+
+ // Deduplicate to avoid invalid syntax like { foo, foo }
+ const uniqueItems = [...new Set(items)];
+
+ return `{ ${uniqueItems.join(', ')} }`;
+}

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

@@ -1 +1,2 @@
 export { sentryTanstackStart } from './sentryTanstackStart';
+export type { SentryTanstackStartOptions } from './sentryTanstackStart';

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

@@ -1,7 +1,26 @@
 import type { BuildTimeOptionsBase } from '@sentry/core';
 import type { Plugin } from 'vite';
+import { makeAutoInstrumentMiddlewarePlugin } from './autoInstrumentMiddleware';
 import { makeAddSentryVitePlugin, makeEnableSourceMapsVitePlugin } from './sourceMaps';
 
+/**
+ * Build-time options for the Sentry TanStack Start SDK.
+ */
+export interface SentryTanstackStartOptions extends BuildTimeOptionsBase {
+ /**
+ * If this flag is `true`, the Sentry plugins will automatically instrument TanStack Start middlewares.
+ *
+ * This wraps global middlewares (`requestMiddleware` and `functionMiddleware`) in `createStart()` with Sentry
+ * instrumentation to capture performance data.
+ *
+ * Set to `false` to disable automatic middleware instrumentation if you prefer to wrap middlewares manually
+ * using `wrapMiddlewaresWithSentry`.
+ *
+ * @default true
+ */
+ autoInstrumentMiddleware?: boolean;
+}
+
 /**
  * Vite plugins for the Sentry TanStack Start SDK.
  *
@@ -14,26 +33,32 @@ import { makeAddSentryVitePlugin, makeEnableSourceMapsVitePlugin } from './sourc
  *
  * export default defineConfig({
  * plugins: [
+ * tanstackStart(),
  * sentryTanstackStart({
  * org: 'your-org',
  * project: 'your-project',
  * }),
- * tanstackStart(),
  * ],
  * });
  * ```
  *
  * @param options - Options to configure the Sentry Vite plugins
  * @returns An array of Vite plugins
  */
-export function sentryTanstackStart(options: BuildTimeOptionsBase = {}): Plugin[] {
- // Only add plugins in production builds
+export function sentryTanstackStart(options: SentryTanstackStartOptions = {}): Plugin[] {
+ // only add plugins in production builds
  if (process.env.NODE_ENV === 'development') {
  return [];
  }
 
  const plugins: Plugin[] = [...makeAddSentryVitePlugin(options)];
 
+ // middleware auto-instrumentation
+ if (options.autoInstrumentMiddleware !== false) {
+ plugins.push(makeAutoInstrumentMiddlewarePlugin({ enabled: true, debug: options.debug }));
+ }
+
+ // source maps
  const sourceMapsDisabled = options.sourcemaps?.disable === true || options.sourcemaps?.disable === 'disable-upload';
  if (!sourceMapsDisabled) {
  plugins.push(...makeEnableSourceMapsVitePlugin(options));

CHANGELOG.md

@@ -4,6 +4,24 @@
 
 - "You miss 100 percent of the chances you don't take. — Wayne Gretzky" — Michael Scott
 
+- **feat(tanstackstart-react): Auto-instrument global middleware in `sentryTanstackStart` Vite plugin ([#18884](https://github.com/getsentry/sentry-javascript/pull/18844))**
+
+ The `sentryTanstackStart` Vite plugin now automatically instruments `requestMiddleware` and `functionMiddleware` arrays in `createStart()`. This captures performance data without requiring manual wrapping.
+
+ Auto-instrumentation is enabled by default. To disable it:
+
+ ```ts
+ // vite.config.ts
+ sentryTanstackStart({
+ authToken: process.env.SENTRY_AUTH_TOKEN,
+ org: 'your-org',
+ project: 'your-project',
+ autoInstrumentMiddleware: false,
+ });
+ ```
+
+### Other Changes
+
 ## 10.36.0
 
 - feat(node): Add Prisma v7 support ([#18908](https://github.com/getsentry/sentry-javascript/pull/18908))

dev-packages/e2e-tests/test-applications/tanstackstart-react/src/middleware.ts

@@ -2,13 +2,15 @@ import { createMiddleware } from '@tanstack/react-start';
 import { wrapMiddlewaresWithSentry } from '@sentry/tanstackstart-react';
 
 // Global request middleware - runs on every request
-const globalRequestMiddleware = createMiddleware().server(async ({ next }) => {
+// NOTE: This is exported unwrapped to test auto-instrumentation via the Vite plugin
+export const globalRequestMiddleware = createMiddleware().server(async ({ next }) => {
  console.log('Global request middleware executed');
  return next();
 });
 
 // Global function middleware - runs on every server function
-const globalFunctionMiddleware = createMiddleware({ type: 'function' }).server(async ({ next }) => {
+// NOTE: This is exported unwrapped to test auto-instrumentation via the Vite plugin
+export const globalFunctionMiddleware = createMiddleware({ type: 'function' }).server(async ({ next }) => {
  console.log('Global function middleware executed');
  return next();
 });
@@ -37,17 +39,13 @@ const errorMiddleware = createMiddleware({ type: 'function' }).server(async () =
  throw new Error('Middleware Error Test');
 });
 
-// Manually wrap middlewares with Sentry
+// Manually wrap middlewares with Sentry (for middlewares that won't be auto-instrumented)
 export const [
- wrappedGlobalRequestMiddleware,
- wrappedGlobalFunctionMiddleware,
  wrappedServerFnMiddleware,
  wrappedServerRouteRequestMiddleware,
  wrappedEarlyReturnMiddleware,
  wrappedErrorMiddleware,
 ] = wrapMiddlewaresWithSentry({
- globalRequestMiddleware,
- globalFunctionMiddleware,
  serverFnMiddleware,
  serverRouteRequestMiddleware,
  earlyReturnMiddleware,

dev-packages/e2e-tests/test-applications/tanstackstart-react/src/start.ts

@@ -1,9 +1,10 @@
 import { createStart } from '@tanstack/react-start';
-import { wrappedGlobalRequestMiddleware, wrappedGlobalFunctionMiddleware } from './middleware';
+// NOTE: These are NOT wrapped - auto-instrumentation via the Vite plugin will wrap them
+import { globalRequestMiddleware, globalFunctionMiddleware } from './middleware';
 
 export const startInstance = createStart(() => {
  return {
- requestMiddleware: [wrappedGlobalRequestMiddleware],
- functionMiddleware: [wrappedGlobalFunctionMiddleware],
+ requestMiddleware: [globalRequestMiddleware],
+ functionMiddleware: [globalFunctionMiddleware],
  };
 });

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

@@ -0,0 +1,119 @@
+import type { Plugin } from 'vite';
+
+type AutoInstrumentMiddlewareOptions = {
+ enabled?: boolean;
+ debug?: boolean;
+};
+
+/**
+ * A Vite plugin that automatically instruments TanStack Start middlewares
+ * by wrapping `requestMiddleware` and `functionMiddleware` arrays in `createStart()`.
+ */
+export function makeAutoInstrumentMiddlewarePlugin(options: AutoInstrumentMiddlewareOptions = {}): Plugin {
+ const { enabled = true, debug = false } = options;
+
+ return {
+ name: 'sentry-tanstack-middleware-auto-instrument',
+ enforce: 'pre',
+
+ transform(code, id) {
+ if (!enabled) {
+ return null;
+ }
+
+ // Skip if not a TS/JS file
+ if (!/\.(ts|tsx|js|jsx|mjs|mts)$/.test(id)) {
+ return null;
+ }
+
+ // Only wrap requestMiddleware and functionMiddleware in createStart()
+ // createStart() should always be in a file named start.ts
+ if (!id.includes('start') || !code.includes('createStart(')) {
+ return null;
+ }
+
+ // Skip if the user already did some manual wrapping
+ if (code.includes('wrapMiddlewaresWithSentry')) {
+ return null;
+ }
+
+ let transformed = code;
+ let needsImport = false;
+ const skippedMiddlewares: string[] = [];
+
+ transformed = transformed.replace(
+ /(requestMiddleware|functionMiddleware)\s*:\s*\[([^\]]*)\]/g,
+ (match: string, key: string, contents: string) => {
+ const objContents = arrayToObjectShorthand(contents);
+ if (objContents) {
+ needsImport = true;
+ if (debug) {
+ // eslint-disable-next-line no-console
+ console.log(`[Sentry] Auto-wrapping ${key} in ${id}`);
+ }
+ return `${key}: wrapMiddlewaresWithSentry(${objContents})`;
+ }
+ // Track middlewares that couldn't be auto-wrapped
+ // Skip if we matched whitespace only
+ if (contents.trim()) {
+ skippedMiddlewares.push(key);
+ }
+ return match;
+ },
+ );
+
+ // Warn about middlewares that couldn't be auto-wrapped
+ if (skippedMiddlewares.length > 0) {
+ // eslint-disable-next-line no-console
+ console.warn(
+ `[Sentry] Could not auto-instrument ${skippedMiddlewares.join(' and ')} in ${id}. ` +
+ 'To instrument these middlewares, use wrapMiddlewaresWithSentry() manually. ',
+ );
+ }
+
+ // We didn't wrap any middlewares, so we don't need to import the wrapMiddlewaresWithSentry function
+ if (!needsImport) {
+ return null;
+ }
+
+ const sentryImport = "import { wrapMiddlewaresWithSentry } from '@sentry/tanstackstart-react';\n";
+
+ // Check for 'use server' or 'use client' directives, these need to be before any imports
+ const directiveMatch = transformed.match(/^(['"])use (client|server)\1;?\s*\n?/);
+ if (directiveMatch) {
+ // Insert import after the directive
+ const directive = directiveMatch[0];
+ transformed = directive + sentryImport + transformed.slice(directive.length);
+ } else {
+ transformed = sentryImport + transformed;
+ }
+
+ return { code: transformed, map: null };
+ },
+ };
+}
+
+/**
+ * Convert array contents to object shorthand syntax.
+ * e.g., "foo, bar, baz" → "{ foo, bar, baz }"
+ *
+ * Returns null if contents contain non-identifier expressions (function calls, etc.)
+ * which cannot be converted to object shorthand.
+ */
+export function arrayToObjectShorthand(contents: string): string | null {
+ const items = contents
+ .split(',')
+ .map(s => s.trim())
+ .filter(Boolean);
+
+ // Only convert if all items are valid identifiers (no complex expressions)
+ const allIdentifiers = items.every(item => /^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(item));
+ if (!allIdentifiers || items.length === 0) {
+ return null;
+ }
+
+ // Deduplicate to avoid invalid syntax like { foo, foo }
+ const uniqueItems = [...new Set(items)];
+
+ return `{ ${uniqueItems.join(', ')} }`;
+}

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

@@ -1 +1,2 @@
 export { sentryTanstackStart } from './sentryTanstackStart';
+export type { SentryTanstackStartOptions } from './sentryTanstackStart';

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

@@ -1,7 +1,26 @@
 import type { BuildTimeOptionsBase } from '@sentry/core';
 import type { Plugin } from 'vite';
+import { makeAutoInstrumentMiddlewarePlugin } from './autoInstrumentMiddleware';
 import { makeAddSentryVitePlugin, makeEnableSourceMapsVitePlugin } from './sourceMaps';
 
+/**
+ * Build-time options for the Sentry TanStack Start SDK.
+ */
+export interface SentryTanstackStartOptions extends BuildTimeOptionsBase {
+ /**
+ * If this flag is `true`, the Sentry plugins will automatically instrument TanStack Start middlewares.
+ *
+ * This wraps global middlewares (`requestMiddleware` and `functionMiddleware`) in `createStart()` with Sentry
+ * instrumentation to capture performance data.
+ *
+ * Set to `false` to disable automatic middleware instrumentation if you prefer to wrap middlewares manually
+ * using `wrapMiddlewaresWithSentry`.
+ *
+ * @default true
+ */
+ autoInstrumentMiddleware?: boolean;
+}
+
 /**
  * Vite plugins for the Sentry TanStack Start SDK.
  *
@@ -14,26 +33,32 @@ import { makeAddSentryVitePlugin, makeEnableSourceMapsVitePlugin } from './sourc
  *
  * export default defineConfig({
  * plugins: [
+ * tanstackStart(),
  * sentryTanstackStart({
  * org: 'your-org',
  * project: 'your-project',
  * }),
- * tanstackStart(),
  * ],
  * });
  * ```
  *
  * @param options - Options to configure the Sentry Vite plugins
  * @returns An array of Vite plugins
  */
-export function sentryTanstackStart(options: BuildTimeOptionsBase = {}): Plugin[] {
- // Only add plugins in production builds
+export function sentryTanstackStart(options: SentryTanstackStartOptions = {}): Plugin[] {
+ // only add plugins in production builds
  if (process.env.NODE_ENV === 'development') {
  return [];
  }
 
  const plugins: Plugin[] = [...makeAddSentryVitePlugin(options)];
 
+ // middleware auto-instrumentation
+ if (options.autoInstrumentMiddleware !== false) {
+ plugins.push(makeAutoInstrumentMiddlewarePlugin({ enabled: true, debug: options.debug }));
+ }
+
+ // source maps
  const sourceMapsDisabled = options.sourcemaps?.disable === true || options.sourcemaps?.disable === 'disable-upload';
  if (!sourceMapsDisabled) {
  plugins.push(...makeEnableSourceMapsVitePlugin(options));

CHANGELOG.md

@@ -4,6 +4,24 @@
 
 - "You miss 100 percent of the chances you don't take. — Wayne Gretzky" — Michael Scott
 
+- **feat(tanstackstart-react): Auto-instrument global middleware in `sentryTanstackStart` Vite plugin ([#18884](https://github.com/getsentry/sentry-javascript/pull/18844))**
+
+ The `sentryTanstackStart` Vite plugin now automatically instruments `requestMiddleware` and `functionMiddleware` arrays in `createStart()`. This captures performance data without requiring manual wrapping.
+
+ Auto-instrumentation is enabled by default. To disable it:
+
+ ```ts
+ // vite.config.ts
+ sentryTanstackStart({
+ authToken: process.env.SENTRY_AUTH_TOKEN,
+ org: 'your-org',
+ project: 'your-project',
+ autoInstrumentMiddleware: false,
+ });
+ ```
+
+### Other Changes
+
 ## 10.36.0
 
 - feat(node): Add Prisma v7 support ([#18908](https://github.com/getsentry/sentry-javascript/pull/18908))

dev-packages/e2e-tests/test-applications/tanstackstart-react/src/middleware.ts

@@ -2,13 +2,15 @@ import { createMiddleware } from '@tanstack/react-start';
 import { wrapMiddlewaresWithSentry } from '@sentry/tanstackstart-react';
 
 // Global request middleware - runs on every request
-const globalRequestMiddleware = createMiddleware().server(async ({ next }) => {
+// NOTE: This is exported unwrapped to test auto-instrumentation via the Vite plugin
+export const globalRequestMiddleware = createMiddleware().server(async ({ next }) => {
  console.log('Global request middleware executed');
  return next();
 });
 
 // Global function middleware - runs on every server function
-const globalFunctionMiddleware = createMiddleware({ type: 'function' }).server(async ({ next }) => {
+// NOTE: This is exported unwrapped to test auto-instrumentation via the Vite plugin
+export const globalFunctionMiddleware = createMiddleware({ type: 'function' }).server(async ({ next }) => {
  console.log('Global function middleware executed');
  return next();
 });
@@ -37,17 +39,13 @@ const errorMiddleware = createMiddleware({ type: 'function' }).server(async () =
  throw new Error('Middleware Error Test');
 });
 
-// Manually wrap middlewares with Sentry
+// Manually wrap middlewares with Sentry (for middlewares that won't be auto-instrumented)
 export const [
- wrappedGlobalRequestMiddleware,
- wrappedGlobalFunctionMiddleware,
  wrappedServerFnMiddleware,
  wrappedServerRouteRequestMiddleware,
  wrappedEarlyReturnMiddleware,
  wrappedErrorMiddleware,
 ] = wrapMiddlewaresWithSentry({
- globalRequestMiddleware,
- globalFunctionMiddleware,
  serverFnMiddleware,
  serverRouteRequestMiddleware,
  earlyReturnMiddleware,

dev-packages/e2e-tests/test-applications/tanstackstart-react/src/start.ts

@@ -1,9 +1,10 @@
 import { createStart } from '@tanstack/react-start';
-import { wrappedGlobalRequestMiddleware, wrappedGlobalFunctionMiddleware } from './middleware';
+// NOTE: These are NOT wrapped - auto-instrumentation via the Vite plugin will wrap them
+import { globalRequestMiddleware, globalFunctionMiddleware } from './middleware';
 
 export const startInstance = createStart(() => {
  return {
- requestMiddleware: [wrappedGlobalRequestMiddleware],
- functionMiddleware: [wrappedGlobalFunctionMiddleware],
+ requestMiddleware: [globalRequestMiddleware],
+ functionMiddleware: [globalFunctionMiddleware],
  };
 });

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

@@ -0,0 +1,119 @@
+import type { Plugin } from 'vite';
+
+type AutoInstrumentMiddlewareOptions = {
+ enabled?: boolean;
+ debug?: boolean;
+};
+
+/**
+ * A Vite plugin that automatically instruments TanStack Start middlewares
+ * by wrapping `requestMiddleware` and `functionMiddleware` arrays in `createStart()`.
+ */
+export function makeAutoInstrumentMiddlewarePlugin(options: AutoInstrumentMiddlewareOptions = {}): Plugin {
+ const { enabled = true, debug = false } = options;
+
+ return {
+ name: 'sentry-tanstack-middleware-auto-instrument',
+ enforce: 'pre',
+
+ transform(code, id) {
+ if (!enabled) {
+ return null;
+ }
+
+ // Skip if not a TS/JS file
+ if (!/\.(ts|tsx|js|jsx|mjs|mts)$/.test(id)) {
+ return null;
+ }
+
+ // Only wrap requestMiddleware and functionMiddleware in createStart()
+ // createStart() should always be in a file named start.ts
+ if (!id.includes('start') || !code.includes('createStart(')) {
+ return null;
+ }
+
+ // Skip if the user already did some manual wrapping
+ if (code.includes('wrapMiddlewaresWithSentry')) {
+ return null;
+ }
+
+ let transformed = code;
+ let needsImport = false;
+ const skippedMiddlewares: string[] = [];
+
+ transformed = transformed.replace(
+ /(requestMiddleware|functionMiddleware)\s*:\s*\[([^\]]*)\]/g,
+ (match: string, key: string, contents: string) => {
+ const objContents = arrayToObjectShorthand(contents);
+ if (objContents) {
+ needsImport = true;
+ if (debug) {
+ // eslint-disable-next-line no-console
+ console.log(`[Sentry] Auto-wrapping ${key} in ${id}`);
+ }
+ return `${key}: wrapMiddlewaresWithSentry(${objContents})`;
+ }
+ // Track middlewares that couldn't be auto-wrapped
+ // Skip if we matched whitespace only
+ if (contents.trim()) {
+ skippedMiddlewares.push(key);
+ }
+ return match;
+ },
+ );
+
+ // Warn about middlewares that couldn't be auto-wrapped
+ if (skippedMiddlewares.length > 0) {
+ // eslint-disable-next-line no-console
+ console.warn(
+ `[Sentry] Could not auto-instrument ${skippedMiddlewares.join(' and ')} in ${id}. ` +
+ 'To instrument these middlewares, use wrapMiddlewaresWithSentry() manually. ',
+ );
+ }
+
+ // We didn't wrap any middlewares, so we don't need to import the wrapMiddlewaresWithSentry function
+ if (!needsImport) {
+ return null;
+ }
+
+ const sentryImport = "import { wrapMiddlewaresWithSentry } from '@sentry/tanstackstart-react';\n";
+
+ // Check for 'use server' or 'use client' directives, these need to be before any imports
+ const directiveMatch = transformed.match(/^(['"])use (client|server)\1;?\s*\n?/);
+ if (directiveMatch) {
+ // Insert import after the directive
+ const directive = directiveMatch[0];
+ transformed = directive + sentryImport + transformed.slice(directive.length);
+ } else {
+ transformed = sentryImport + transformed;
+ }
+
+ return { code: transformed, map: null };
+ },
+ };
+}
+
+/**
+ * Convert array contents to object shorthand syntax.
+ * e.g., "foo, bar, baz" → "{ foo, bar, baz }"
+ *
+ * Returns null if contents contain non-identifier expressions (function calls, etc.)
+ * which cannot be converted to object shorthand.
+ */
+export function arrayToObjectShorthand(contents: string): string | null {
+ const items = contents
+ .split(',')
+ .map(s => s.trim())
+ .filter(Boolean);
+
+ // Only convert if all items are valid identifiers (no complex expressions)
+ const allIdentifiers = items.every(item => /^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(item));
+ if (!allIdentifiers || items.length === 0) {
+ return null;
+ }
+
+ // Deduplicate to avoid invalid syntax like { foo, foo }
+ const uniqueItems = [...new Set(items)];
+
+ return `{ ${uniqueItems.join(', ')} }`;
+}

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

@@ -1 +1,2 @@
 export { sentryTanstackStart } from './sentryTanstackStart';
+export type { SentryTanstackStartOptions } from './sentryTanstackStart';

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

@@ -1,7 +1,26 @@
 import type { BuildTimeOptionsBase } from '@sentry/core';
 import type { Plugin } from 'vite';
+import { makeAutoInstrumentMiddlewarePlugin } from './autoInstrumentMiddleware';
 import { makeAddSentryVitePlugin, makeEnableSourceMapsVitePlugin } from './sourceMaps';
 
+/**
+ * Build-time options for the Sentry TanStack Start SDK.
+ */
+export interface SentryTanstackStartOptions extends BuildTimeOptionsBase {
+ /**
+ * If this flag is `true`, the Sentry plugins will automatically instrument TanStack Start middlewares.
+ *
+ * This wraps global middlewares (`requestMiddleware` and `functionMiddleware`) in `createStart()` with Sentry
+ * instrumentation to capture performance data.
+ *
+ * Set to `false` to disable automatic middleware instrumentation if you prefer to wrap middlewares manually
+ * using `wrapMiddlewaresWithSentry`.
+ *
+ * @default true
+ */
+ autoInstrumentMiddleware?: boolean;
+}
+
 /**
  * Vite plugins for the Sentry TanStack Start SDK.
  *
@@ -14,26 +33,32 @@ import { makeAddSentryVitePlugin, makeEnableSourceMapsVitePlugin } from './sourc
  *
  * export default defineConfig({
  * plugins: [
+ * tanstackStart(),
  * sentryTanstackStart({
  * org: 'your-org',
  * project: 'your-project',
  * }),
- * tanstackStart(),
  * ],
  * });
  * ```
  *
  * @param options - Options to configure the Sentry Vite plugins
  * @returns An array of Vite plugins
  */
-export function sentryTanstackStart(options: BuildTimeOptionsBase = {}): Plugin[] {
- // Only add plugins in production builds
+export function sentryTanstackStart(options: SentryTanstackStartOptions = {}): Plugin[] {
+ // only add plugins in production builds
  if (process.env.NODE_ENV === 'development') {
  return [];
  }
 
  const plugins: Plugin[] = [...makeAddSentryVitePlugin(options)];
 
+ // middleware auto-instrumentation
+ if (options.autoInstrumentMiddleware !== false) {
+ plugins.push(makeAutoInstrumentMiddlewarePlugin({ enabled: true, debug: options.debug }));
+ }
+
+ // source maps
  const sourceMapsDisabled = options.sourcemaps?.disable === true || options.sourcemaps?.disable === 'disable-upload';
  if (!sourceMapsDisabled) {
  plugins.push(...makeEnableSourceMapsVitePlugin(options));

CHANGELOG.md

@@ -4,6 +4,24 @@
 
 - "You miss 100 percent of the chances you don't take. — Wayne Gretzky" — Michael Scott
 
+- **feat(tanstackstart-react): Auto-instrument global middleware in `sentryTanstackStart` Vite plugin ([#18884](https://github.com/getsentry/sentry-javascript/pull/18844))**
+
+ The `sentryTanstackStart` Vite plugin now automatically instruments `requestMiddleware` and `functionMiddleware` arrays in `createStart()`. This captures performance data without requiring manual wrapping.
+
+ Auto-instrumentation is enabled by default. To disable it:
+
+ ```ts
+ // vite.config.ts
+ sentryTanstackStart({
+ authToken: process.env.SENTRY_AUTH_TOKEN,
+ org: 'your-org',
+ project: 'your-project',
+ autoInstrumentMiddleware: false,
+ });
+ ```
+
+### Other Changes
+
 ## 10.36.0
 
 - feat(node): Add Prisma v7 support ([#18908](https://github.com/getsentry/sentry-javascript/pull/18908))

dev-packages/e2e-tests/test-applications/tanstackstart-react/src/middleware.ts

@@ -2,13 +2,15 @@ import { createMiddleware } from '@tanstack/react-start';
 import { wrapMiddlewaresWithSentry } from '@sentry/tanstackstart-react';
 
 // Global request middleware - runs on every request
-const globalRequestMiddleware = createMiddleware().server(async ({ next }) => {
+// NOTE: This is exported unwrapped to test auto-instrumentation via the Vite plugin
+export const globalRequestMiddleware = createMiddleware().server(async ({ next }) => {
  console.log('Global request middleware executed');
  return next();
 });
 
 // Global function middleware - runs on every server function
-const globalFunctionMiddleware = createMiddleware({ type: 'function' }).server(async ({ next }) => {
+// NOTE: This is exported unwrapped to test auto-instrumentation via the Vite plugin
+export const globalFunctionMiddleware = createMiddleware({ type: 'function' }).server(async ({ next }) => {
  console.log('Global function middleware executed');
  return next();
 });
@@ -37,17 +39,13 @@ const errorMiddleware = createMiddleware({ type: 'function' }).server(async () =
  throw new Error('Middleware Error Test');
 });
 
-// Manually wrap middlewares with Sentry
+// Manually wrap middlewares with Sentry (for middlewares that won't be auto-instrumented)
 export const [
- wrappedGlobalRequestMiddleware,
- wrappedGlobalFunctionMiddleware,
  wrappedServerFnMiddleware,
  wrappedServerRouteRequestMiddleware,
  wrappedEarlyReturnMiddleware,
  wrappedErrorMiddleware,
 ] = wrapMiddlewaresWithSentry({
- globalRequestMiddleware,
- globalFunctionMiddleware,
  serverFnMiddleware,
  serverRouteRequestMiddleware,
  earlyReturnMiddleware,

dev-packages/e2e-tests/test-applications/tanstackstart-react/src/start.ts

@@ -1,9 +1,10 @@
 import { createStart } from '@tanstack/react-start';
-import { wrappedGlobalRequestMiddleware, wrappedGlobalFunctionMiddleware } from './middleware';
+// NOTE: These are NOT wrapped - auto-instrumentation via the Vite plugin will wrap them
+import { globalRequestMiddleware, globalFunctionMiddleware } from './middleware';
 
 export const startInstance = createStart(() => {
  return {
- requestMiddleware: [wrappedGlobalRequestMiddleware],
- functionMiddleware: [wrappedGlobalFunctionMiddleware],
+ requestMiddleware: [globalRequestMiddleware],
+ functionMiddleware: [globalFunctionMiddleware],
  };
 });

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

@@ -0,0 +1,119 @@
+import type { Plugin } from 'vite';
+
+type AutoInstrumentMiddlewareOptions = {
+ enabled?: boolean;
+ debug?: boolean;
+};
+
+/**
+ * A Vite plugin that automatically instruments TanStack Start middlewares
+ * by wrapping `requestMiddleware` and `functionMiddleware` arrays in `createStart()`.
+ */
+export function makeAutoInstrumentMiddlewarePlugin(options: AutoInstrumentMiddlewareOptions = {}): Plugin {
+ const { enabled = true, debug = false } = options;
+
+ return {
+ name: 'sentry-tanstack-middleware-auto-instrument',
+ enforce: 'pre',
+
+ transform(code, id) {
+ if (!enabled) {
+ return null;
+ }
+
+ // Skip if not a TS/JS file
+ if (!/\.(ts|tsx|js|jsx|mjs|mts)$/.test(id)) {
+ return null;
+ }
+
+ // Only wrap requestMiddleware and functionMiddleware in createStart()
+ // createStart() should always be in a file named start.ts
+ if (!id.includes('start') || !code.includes('createStart(')) {
+ return null;
+ }
+
+ // Skip if the user already did some manual wrapping
+ if (code.includes('wrapMiddlewaresWithSentry')) {
+ return null;
+ }
+
+ let transformed = code;
+ let needsImport = false;
+ const skippedMiddlewares: string[] = [];
+
+ transformed = transformed.replace(
+ /(requestMiddleware|functionMiddleware)\s*:\s*\[([^\]]*)\]/g,
+ (match: string, key: string, contents: string) => {
+ const objContents = arrayToObjectShorthand(contents);
+ if (objContents) {
+ needsImport = true;
+ if (debug) {
+ // eslint-disable-next-line no-console
+ console.log(`[Sentry] Auto-wrapping ${key} in ${id}`);
+ }
+ return `${key}: wrapMiddlewaresWithSentry(${objContents})`;
+ }
+ // Track middlewares that couldn't be auto-wrapped
+ // Skip if we matched whitespace only
+ if (contents.trim()) {
+ skippedMiddlewares.push(key);
+ }
+ return match;
+ },
+ );
+
+ // Warn about middlewares that couldn't be auto-wrapped
+ if (skippedMiddlewares.length > 0) {
+ // eslint-disable-next-line no-console
+ console.warn(
+ `[Sentry] Could not auto-instrument ${skippedMiddlewares.join(' and ')} in ${id}. ` +
+ 'To instrument these middlewares, use wrapMiddlewaresWithSentry() manually. ',
+ );
+ }
+
+ // We didn't wrap any middlewares, so we don't need to import the wrapMiddlewaresWithSentry function
+ if (!needsImport) {
+ return null;
+ }
+
+ const sentryImport = "import { wrapMiddlewaresWithSentry } from '@sentry/tanstackstart-react';\n";
+
+ // Check for 'use server' or 'use client' directives, these need to be before any imports
+ const directiveMatch = transformed.match(/^(['"])use (client|server)\1;?\s*\n?/);
+ if (directiveMatch) {
+ // Insert import after the directive
+ const directive = directiveMatch[0];
+ transformed = directive + sentryImport + transformed.slice(directive.length);
+ } else {
+ transformed = sentryImport + transformed;
+ }
+
+ return { code: transformed, map: null };
+ },
+ };
+}
+
+/**
+ * Convert array contents to object shorthand syntax.
+ * e.g., "foo, bar, baz" → "{ foo, bar, baz }"
+ *
+ * Returns null if contents contain non-identifier expressions (function calls, etc.)
+ * which cannot be converted to object shorthand.
+ */
+export function arrayToObjectShorthand(contents: string): string | null {
+ const items = contents
+ .split(',')
+ .map(s => s.trim())
+ .filter(Boolean);
+
+ // Only convert if all items are valid identifiers (no complex expressions)
+ const allIdentifiers = items.every(item => /^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(item));
+ if (!allIdentifiers || items.length === 0) {
+ return null;
+ }
+
+ // Deduplicate to avoid invalid syntax like { foo, foo }
+ const uniqueItems = [...new Set(items)];
+
+ return `{ ${uniqueItems.join(', ')} }`;
+}

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

@@ -1 +1,2 @@
 export { sentryTanstackStart } from './sentryTanstackStart';
+export type { SentryTanstackStartOptions } from './sentryTanstackStart';

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

@@ -1,7 +1,26 @@
 import type { BuildTimeOptionsBase } from '@sentry/core';
 import type { Plugin } from 'vite';
+import { makeAutoInstrumentMiddlewarePlugin } from './autoInstrumentMiddleware';
 import { makeAddSentryVitePlugin, makeEnableSourceMapsVitePlugin } from './sourceMaps';
 
+/**
+ * Build-time options for the Sentry TanStack Start SDK.
+ */
+export interface SentryTanstackStartOptions extends BuildTimeOptionsBase {
+ /**
+ * If this flag is `true`, the Sentry plugins will automatically instrument TanStack Start middlewares.
+ *
+ * This wraps global middlewares (`requestMiddleware` and `functionMiddleware`) in `createStart()` with Sentry
+ * instrumentation to capture performance data.
+ *
+ * Set to `false` to disable automatic middleware instrumentation if you prefer to wrap middlewares manually
+ * using `wrapMiddlewaresWithSentry`.
+ *
+ * @default true
+ */
+ autoInstrumentMiddleware?: boolean;
+}
+
 /**
  * Vite plugins for the Sentry TanStack Start SDK.
  *
@@ -14,26 +33,32 @@ import { makeAddSentryVitePlugin, makeEnableSourceMapsVitePlugin } from './sourc
  *
  * export default defineConfig({
  * plugins: [
+ * tanstackStart(),
  * sentryTanstackStart({
  * org: 'your-org',
  * project: 'your-project',
  * }),
- * tanstackStart(),
  * ],
  * });
  * ```
  *
  * @param options - Options to configure the Sentry Vite plugins
  * @returns An array of Vite plugins
  */
-export function sentryTanstackStart(options: BuildTimeOptionsBase = {}): Plugin[] {
- // Only add plugins in production builds
+export function sentryTanstackStart(options: SentryTanstackStartOptions = {}): Plugin[] {
+ // only add plugins in production builds
  if (process.env.NODE_ENV === 'development') {
  return [];
  }
 
  const plugins: Plugin[] = [...makeAddSentryVitePlugin(options)];
 
+ // middleware auto-instrumentation
+ if (options.autoInstrumentMiddleware !== false) {
+ plugins.push(makeAutoInstrumentMiddlewarePlugin({ enabled: true, debug: options.debug }));
+ }
+
+ // source maps
  const sourceMapsDisabled = options.sourcemaps?.disable === true || options.sourcemaps?.disable === 'disable-upload';
  if (!sourceMapsDisabled) {
  plugins.push(...makeEnableSourceMapsVitePlugin(options));

CHANGELOG.md

@@ -4,6 +4,24 @@
 
 - "You miss 100 percent of the chances you don't take. — Wayne Gretzky" — Michael Scott
 
+- **feat(tanstackstart-react): Auto-instrument global middleware in `sentryTanstackStart` Vite plugin ([#18884](https://github.com/getsentry/sentry-javascript/pull/18844))**
+
+ The `sentryTanstackStart` Vite plugin now automatically instruments `requestMiddleware` and `functionMiddleware` arrays in `createStart()`. This captures performance data without requiring manual wrapping.
+
+ Auto-instrumentation is enabled by default. To disable it:
+
+ ```ts
+ // vite.config.ts
+ sentryTanstackStart({
+ authToken: process.env.SENTRY_AUTH_TOKEN,
+ org: 'your-org',
+ project: 'your-project',
+ autoInstrumentMiddleware: false,
+ });
+ ```
+
+### Other Changes
+
 ## 10.36.0
 
 - feat(node): Add Prisma v7 support ([#18908](https://github.com/getsentry/sentry-javascript/pull/18908))

dev-packages/e2e-tests/test-applications/tanstackstart-react/src/middleware.ts

@@ -2,13 +2,15 @@ import { createMiddleware } from '@tanstack/react-start';
 import { wrapMiddlewaresWithSentry } from '@sentry/tanstackstart-react';
 
 // Global request middleware - runs on every request
-const globalRequestMiddleware = createMiddleware().server(async ({ next }) => {
+// NOTE: This is exported unwrapped to test auto-instrumentation via the Vite plugin
+export const globalRequestMiddleware = createMiddleware().server(async ({ next }) => {
  console.log('Global request middleware executed');
  return next();
 });
 
 // Global function middleware - runs on every server function
-const globalFunctionMiddleware = createMiddleware({ type: 'function' }).server(async ({ next }) => {
+// NOTE: This is exported unwrapped to test auto-instrumentation via the Vite plugin
+export const globalFunctionMiddleware = createMiddleware({ type: 'function' }).server(async ({ next }) => {
  console.log('Global function middleware executed');
  return next();
 });
@@ -37,17 +39,13 @@ const errorMiddleware = createMiddleware({ type: 'function' }).server(async () =
  throw new Error('Middleware Error Test');
 });
 
-// Manually wrap middlewares with Sentry
+// Manually wrap middlewares with Sentry (for middlewares that won't be auto-instrumented)
 export const [
- wrappedGlobalRequestMiddleware,
- wrappedGlobalFunctionMiddleware,
  wrappedServerFnMiddleware,
  wrappedServerRouteRequestMiddleware,
  wrappedEarlyReturnMiddleware,
  wrappedErrorMiddleware,
 ] = wrapMiddlewaresWithSentry({
- globalRequestMiddleware,
- globalFunctionMiddleware,
  serverFnMiddleware,
  serverRouteRequestMiddleware,
  earlyReturnMiddleware,

dev-packages/e2e-tests/test-applications/tanstackstart-react/src/start.ts

@@ -1,9 +1,10 @@
 import { createStart } from '@tanstack/react-start';
-import { wrappedGlobalRequestMiddleware, wrappedGlobalFunctionMiddleware } from './middleware';
+// NOTE: These are NOT wrapped - auto-instrumentation via the Vite plugin will wrap them
+import { globalRequestMiddleware, globalFunctionMiddleware } from './middleware';
 
 export const startInstance = createStart(() => {
  return {
- requestMiddleware: [wrappedGlobalRequestMiddleware],
- functionMiddleware: [wrappedGlobalFunctionMiddleware],
+ requestMiddleware: [globalRequestMiddleware],
+ functionMiddleware: [globalFunctionMiddleware],
  };
 });

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

@@ -0,0 +1,119 @@
+import type { Plugin } from 'vite';
+
+type AutoInstrumentMiddlewareOptions = {
+ enabled?: boolean;
+ debug?: boolean;
+};
+
+/**
+ * A Vite plugin that automatically instruments TanStack Start middlewares
+ * by wrapping `requestMiddleware` and `functionMiddleware` arrays in `createStart()`.
+ */
+export function makeAutoInstrumentMiddlewarePlugin(options: AutoInstrumentMiddlewareOptions = {}): Plugin {
+ const { enabled = true, debug = false } = options;
+
+ return {
+ name: 'sentry-tanstack-middleware-auto-instrument',
+ enforce: 'pre',
+
+ transform(code, id) {
+ if (!enabled) {
+ return null;
+ }
+
+ // Skip if not a TS/JS file
+ if (!/\.(ts|tsx|js|jsx|mjs|mts)$/.test(id)) {
+ return null;
+ }
+
+ // Only wrap requestMiddleware and functionMiddleware in createStart()
+ // createStart() should always be in a file named start.ts
+ if (!id.includes('start') || !code.includes('createStart(')) {
+ return null;
+ }
+
+ // Skip if the user already did some manual wrapping
+ if (code.includes('wrapMiddlewaresWithSentry')) {
+ return null;
+ }
+
+ let transformed = code;
+ let needsImport = false;
+ const skippedMiddlewares: string[] = [];
+
+ transformed = transformed.replace(
+ /(requestMiddleware|functionMiddleware)\s*:\s*\[([^\]]*)\]/g,
+ (match: string, key: string, contents: string) => {
+ const objContents = arrayToObjectShorthand(contents);
+ if (objContents) {
+ needsImport = true;
+ if (debug) {
+ // eslint-disable-next-line no-console
+ console.log(`[Sentry] Auto-wrapping ${key} in ${id}`);
+ }
+ return `${key}: wrapMiddlewaresWithSentry(${objContents})`;
+ }
+ // Track middlewares that couldn't be auto-wrapped
+ // Skip if we matched whitespace only
+ if (contents.trim()) {
+ skippedMiddlewares.push(key);
+ }
+ return match;
+ },
+ );
+
+ // Warn about middlewares that couldn't be auto-wrapped
+ if (skippedMiddlewares.length > 0) {
+ // eslint-disable-next-line no-console
+ console.warn(
+ `[Sentry] Could not auto-instrument ${skippedMiddlewares.join(' and ')} in ${id}. ` +
+ 'To instrument these middlewares, use wrapMiddlewaresWithSentry() manually. ',
+ );
+ }
+
+ // We didn't wrap any middlewares, so we don't need to import the wrapMiddlewaresWithSentry function
+ if (!needsImport) {
+ return null;
+ }
+
+ const sentryImport = "import { wrapMiddlewaresWithSentry } from '@sentry/tanstackstart-react';\n";
+
+ // Check for 'use server' or 'use client' directives, these need to be before any imports
+ const directiveMatch = transformed.match(/^(['"])use (client|server)\1;?\s*\n?/);
+ if (directiveMatch) {
+ // Insert import after the directive
+ const directive = directiveMatch[0];
+ transformed = directive + sentryImport + transformed.slice(directive.length);
+ } else {
+ transformed = sentryImport + transformed;
+ }
+
+ return { code: transformed, map: null };
+ },
+ };
+}
+
+/**
+ * Convert array contents to object shorthand syntax.
+ * e.g., "foo, bar, baz" → "{ foo, bar, baz }"
+ *
+ * Returns null if contents contain non-identifier expressions (function calls, etc.)
+ * which cannot be converted to object shorthand.
+ */
+export function arrayToObjectShorthand(contents: string): string | null {
+ const items = contents
+ .split(',')
+ .map(s => s.trim())
+ .filter(Boolean);
+
+ // Only convert if all items are valid identifiers (no complex expressions)
+ const allIdentifiers = items.every(item => /^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(item));
+ if (!allIdentifiers || items.length === 0) {
+ return null;
+ }
+
+ // Deduplicate to avoid invalid syntax like { foo, foo }
+ const uniqueItems = [...new Set(items)];
+
+ return `{ ${uniqueItems.join(', ')} }`;
+}

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

@@ -1 +1,2 @@
 export { sentryTanstackStart } from './sentryTanstackStart';
+export type { SentryTanstackStartOptions } from './sentryTanstackStart';

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

@@ -1,7 +1,26 @@
 import type { BuildTimeOptionsBase } from '@sentry/core';
 import type { Plugin } from 'vite';
+import { makeAutoInstrumentMiddlewarePlugin } from './autoInstrumentMiddleware';
 import { makeAddSentryVitePlugin, makeEnableSourceMapsVitePlugin } from './sourceMaps';
 
+/**
+ * Build-time options for the Sentry TanStack Start SDK.
+ */
+export interface SentryTanstackStartOptions extends BuildTimeOptionsBase {
+ /**
+ * If this flag is `true`, the Sentry plugins will automatically instrument TanStack Start middlewares.
+ *
+ * This wraps global middlewares (`requestMiddleware` and `functionMiddleware`) in `createStart()` with Sentry
+ * instrumentation to capture performance data.
+ *
+ * Set to `false` to disable automatic middleware instrumentation if you prefer to wrap middlewares manually
+ * using `wrapMiddlewaresWithSentry`.
+ *
+ * @default true
+ */
+ autoInstrumentMiddleware?: boolean;
+}
+
 /**
  * Vite plugins for the Sentry TanStack Start SDK.
  *
@@ -14,26 +33,32 @@ import { makeAddSentryVitePlugin, makeEnableSourceMapsVitePlugin } from './sourc
  *
  * export default defineConfig({
  * plugins: [
+ * tanstackStart(),
  * sentryTanstackStart({
  * org: 'your-org',
  * project: 'your-project',
  * }),
- * tanstackStart(),
  * ],
  * });
  * ```
  *
  * @param options - Options to configure the Sentry Vite plugins
  * @returns An array of Vite plugins
  */
-export function sentryTanstackStart(options: BuildTimeOptionsBase = {}): Plugin[] {
- // Only add plugins in production builds
+export function sentryTanstackStart(options: SentryTanstackStartOptions = {}): Plugin[] {
+ // only add plugins in production builds
  if (process.env.NODE_ENV === 'development') {
  return [];
  }
 
  const plugins: Plugin[] = [...makeAddSentryVitePlugin(options)];
 
+ // middleware auto-instrumentation
+ if (options.autoInstrumentMiddleware !== false) {
+ plugins.push(makeAutoInstrumentMiddlewarePlugin({ enabled: true, debug: options.debug }));
+ }
+
+ // source maps
  const sourceMapsDisabled = options.sourcemaps?.disable === true || options.sourcemaps?.disable === 'disable-upload';
  if (!sourceMapsDisabled) {
  plugins.push(...makeEnableSourceMapsVitePlugin(options));

CHANGELOG.md

@@ -4,6 +4,24 @@
 
 - "You miss 100 percent of the chances you don't take. — Wayne Gretzky" — Michael Scott
 
+- **feat(tanstackstart-react): Auto-instrument global middleware in `sentryTanstackStart` Vite plugin ([#18884](https://github.com/getsentry/sentry-javascript/pull/18844))**
+
+ The `sentryTanstackStart` Vite plugin now automatically instruments `requestMiddleware` and `functionMiddleware` arrays in `createStart()`. This captures performance data without requiring manual wrapping.
+
+ Auto-instrumentation is enabled by default. To disable it:
+
+ ```ts
+ // vite.config.ts
+ sentryTanstackStart({
+ authToken: process.env.SENTRY_AUTH_TOKEN,
+ org: 'your-org',
+ project: 'your-project',
+ autoInstrumentMiddleware: false,
+ });
+ ```
+
+### Other Changes
+
 ## 10.36.0
 
 - feat(node): Add Prisma v7 support ([#18908](https://github.com/getsentry/sentry-javascript/pull/18908))

dev-packages/e2e-tests/test-applications/tanstackstart-react/src/middleware.ts

@@ -2,13 +2,15 @@ import { createMiddleware } from '@tanstack/react-start';
 import { wrapMiddlewaresWithSentry } from '@sentry/tanstackstart-react';
 
 // Global request middleware - runs on every request
-const globalRequestMiddleware = createMiddleware().server(async ({ next }) => {
+// NOTE: This is exported unwrapped to test auto-instrumentation via the Vite plugin
+export const globalRequestMiddleware = createMiddleware().server(async ({ next }) => {
  console.log('Global request middleware executed');
  return next();
 });
 
 // Global function middleware - runs on every server function
-const globalFunctionMiddleware = createMiddleware({ type: 'function' }).server(async ({ next }) => {
+// NOTE: This is exported unwrapped to test auto-instrumentation via the Vite plugin
+export const globalFunctionMiddleware = createMiddleware({ type: 'function' }).server(async ({ next }) => {
  console.log('Global function middleware executed');
  return next();
 });
@@ -37,17 +39,13 @@ const errorMiddleware = createMiddleware({ type: 'function' }).server(async () =
  throw new Error('Middleware Error Test');
 });
 
-// Manually wrap middlewares with Sentry
+// Manually wrap middlewares with Sentry (for middlewares that won't be auto-instrumented)
 export const [
- wrappedGlobalRequestMiddleware,
- wrappedGlobalFunctionMiddleware,
  wrappedServerFnMiddleware,
  wrappedServerRouteRequestMiddleware,
  wrappedEarlyReturnMiddleware,
  wrappedErrorMiddleware,
 ] = wrapMiddlewaresWithSentry({
- globalRequestMiddleware,
- globalFunctionMiddleware,
  serverFnMiddleware,
  serverRouteRequestMiddleware,
  earlyReturnMiddleware,

dev-packages/e2e-tests/test-applications/tanstackstart-react/src/start.ts

@@ -1,9 +1,10 @@
 import { createStart } from '@tanstack/react-start';
-import { wrappedGlobalRequestMiddleware, wrappedGlobalFunctionMiddleware } from './middleware';
+// NOTE: These are NOT wrapped - auto-instrumentation via the Vite plugin will wrap them
+import { globalRequestMiddleware, globalFunctionMiddleware } from './middleware';
 
 export const startInstance = createStart(() => {
  return {
- requestMiddleware: [wrappedGlobalRequestMiddleware],
- functionMiddleware: [wrappedGlobalFunctionMiddleware],
+ requestMiddleware: [globalRequestMiddleware],
+ functionMiddleware: [globalFunctionMiddleware],
  };
 });

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

@@ -0,0 +1,119 @@
+import type { Plugin } from 'vite';
+
+type AutoInstrumentMiddlewareOptions = {
+ enabled?: boolean;
+ debug?: boolean;
+};
+
+/**
+ * A Vite plugin that automatically instruments TanStack Start middlewares
+ * by wrapping `requestMiddleware` and `functionMiddleware` arrays in `createStart()`.
+ */
+export function makeAutoInstrumentMiddlewarePlugin(options: AutoInstrumentMiddlewareOptions = {}): Plugin {
+ const { enabled = true, debug = false } = options;
+
+ return {
+ name: 'sentry-tanstack-middleware-auto-instrument',
+ enforce: 'pre',
+
+ transform(code, id) {
+ if (!enabled) {
+ return null;
+ }
+
+ // Skip if not a TS/JS file
+ if (!/\.(ts|tsx|js|jsx|mjs|mts)$/.test(id)) {
+ return null;
+ }
+
+ // Only wrap requestMiddleware and functionMiddleware in createStart()
+ // createStart() should always be in a file named start.ts
+ if (!id.includes('start') || !code.includes('createStart(')) {
+ return null;
+ }
+
+ // Skip if the user already did some manual wrapping
+ if (code.includes('wrapMiddlewaresWithSentry')) {
+ return null;
+ }
+
+ let transformed = code;
+ let needsImport = false;
+ const skippedMiddlewares: string[] = [];
+
+ transformed = transformed.replace(
+ /(requestMiddleware|functionMiddleware)\s*:\s*\[([^\]]*)\]/g,
+ (match: string, key: string, contents: string) => {
+ const objContents = arrayToObjectShorthand(contents);
+ if (objContents) {
+ needsImport = true;
+ if (debug) {
+ // eslint-disable-next-line no-console
+ console.log(`[Sentry] Auto-wrapping ${key} in ${id}`);
+ }
+ return `${key}: wrapMiddlewaresWithSentry(${objContents})`;
+ }
+ // Track middlewares that couldn't be auto-wrapped
+ // Skip if we matched whitespace only
+ if (contents.trim()) {
+ skippedMiddlewares.push(key);
+ }
+ return match;
+ },
+ );
+
+ // Warn about middlewares that couldn't be auto-wrapped
+ if (skippedMiddlewares.length > 0) {
+ // eslint-disable-next-line no-console
+ console.warn(
+ `[Sentry] Could not auto-instrument ${skippedMiddlewares.join(' and ')} in ${id}. ` +
+ 'To instrument these middlewares, use wrapMiddlewaresWithSentry() manually. ',
+ );
+ }
+
+ // We didn't wrap any middlewares, so we don't need to import the wrapMiddlewaresWithSentry function
+ if (!needsImport) {
+ return null;
+ }
+
+ const sentryImport = "import { wrapMiddlewaresWithSentry } from '@sentry/tanstackstart-react';\n";
+
+ // Check for 'use server' or 'use client' directives, these need to be before any imports
+ const directiveMatch = transformed.match(/^(['"])use (client|server)\1;?\s*\n?/);
+ if (directiveMatch) {
+ // Insert import after the directive
+ const directive = directiveMatch[0];
+ transformed = directive + sentryImport + transformed.slice(directive.length);
+ } else {
+ transformed = sentryImport + transformed;
+ }
+
+ return { code: transformed, map: null };
+ },
+ };
+}
+
+/**
+ * Convert array contents to object shorthand syntax.
+ * e.g., "foo, bar, baz" → "{ foo, bar, baz }"
+ *
+ * Returns null if contents contain non-identifier expressions (function calls, etc.)
+ * which cannot be converted to object shorthand.
+ */
+export function arrayToObjectShorthand(contents: string): string | null {
+ const items = contents
+ .split(',')
+ .map(s => s.trim())
+ .filter(Boolean);
+
+ // Only convert if all items are valid identifiers (no complex expressions)
+ const allIdentifiers = items.every(item => /^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(item));
+ if (!allIdentifiers || items.length === 0) {
+ return null;
+ }
+
+ // Deduplicate to avoid invalid syntax like { foo, foo }
+ const uniqueItems = [...new Set(items)];
+
+ return `{ ${uniqueItems.join(', ')} }`;
+}

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

@@ -1 +1,2 @@
 export { sentryTanstackStart } from './sentryTanstackStart';
+export type { SentryTanstackStartOptions } from './sentryTanstackStart';

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

@@ -1,7 +1,26 @@
 import type { BuildTimeOptionsBase } from '@sentry/core';
 import type { Plugin } from 'vite';
+import { makeAutoInstrumentMiddlewarePlugin } from './autoInstrumentMiddleware';
 import { makeAddSentryVitePlugin, makeEnableSourceMapsVitePlugin } from './sourceMaps';
 
+/**
+ * Build-time options for the Sentry TanStack Start SDK.
+ */
+export interface SentryTanstackStartOptions extends BuildTimeOptionsBase {
+ /**
+ * If this flag is `true`, the Sentry plugins will automatically instrument TanStack Start middlewares.
+ *
+ * This wraps global middlewares (`requestMiddleware` and `functionMiddleware`) in `createStart()` with Sentry
+ * instrumentation to capture performance data.
+ *
+ * Set to `false` to disable automatic middleware instrumentation if you prefer to wrap middlewares manually
+ * using `wrapMiddlewaresWithSentry`.
+ *
+ * @default true
+ */
+ autoInstrumentMiddleware?: boolean;
+}
+
 /**
  * Vite plugins for the Sentry TanStack Start SDK.
  *
@@ -14,26 +33,32 @@ import { makeAddSentryVitePlugin, makeEnableSourceMapsVitePlugin } from './sourc
  *
  * export default defineConfig({
  * plugins: [
+ * tanstackStart(),
  * sentryTanstackStart({
  * org: 'your-org',
  * project: 'your-project',
  * }),
- * tanstackStart(),
  * ],
  * });
  * ```
  *
  * @param options - Options to configure the Sentry Vite plugins
  * @returns An array of Vite plugins
  */
-export function sentryTanstackStart(options: BuildTimeOptionsBase = {}): Plugin[] {
- // Only add plugins in production builds
+export function sentryTanstackStart(options: SentryTanstackStartOptions = {}): Plugin[] {
+ // only add plugins in production builds
  if (process.env.NODE_ENV === 'development') {
  return [];
  }
 
  const plugins: Plugin[] = [...makeAddSentryVitePlugin(options)];
 
+ // middleware auto-instrumentation
+ if (options.autoInstrumentMiddleware !== false) {
+ plugins.push(makeAutoInstrumentMiddlewarePlugin({ enabled: true, debug: options.debug }));
+ }
+
+ // source maps
  const sourceMapsDisabled = options.sourcemaps?.disable === true || options.sourcemaps?.disable === 'disable-upload';
  if (!sourceMapsDisabled) {
  plugins.push(...makeEnableSourceMapsVitePlugin(options));

CHANGELOG.md

@@ -4,6 +4,24 @@
 
 - "You miss 100 percent of the chances you don't take. — Wayne Gretzky" — Michael Scott
 
+- **feat(tanstackstart-react): Auto-instrument global middleware in `sentryTanstackStart` Vite plugin ([#18884](https://github.com/getsentry/sentry-javascript/pull/18844))**
+
+ The `sentryTanstackStart` Vite plugin now automatically instruments `requestMiddleware` and `functionMiddleware` arrays in `createStart()`. This captures performance data without requiring manual wrapping.
+
+ Auto-instrumentation is enabled by default. To disable it:
+
+ ```ts
+ // vite.config.ts
+ sentryTanstackStart({
+ authToken: process.env.SENTRY_AUTH_TOKEN,
+ org: 'your-org',
+ project: 'your-project',
+ autoInstrumentMiddleware: false,
+ });
+ ```
+
+### Other Changes
+
 ## 10.36.0
 
 - feat(node): Add Prisma v7 support ([#18908](https://github.com/getsentry/sentry-javascript/pull/18908))

dev-packages/e2e-tests/test-applications/tanstackstart-react/src/middleware.ts

@@ -2,13 +2,15 @@ import { createMiddleware } from '@tanstack/react-start';
 import { wrapMiddlewaresWithSentry } from '@sentry/tanstackstart-react';
 
 // Global request middleware - runs on every request
-const globalRequestMiddleware = createMiddleware().server(async ({ next }) => {
+// NOTE: This is exported unwrapped to test auto-instrumentation via the Vite plugin
+export const globalRequestMiddleware = createMiddleware().server(async ({ next }) => {
  console.log('Global request middleware executed');
  return next();
 });
 
 // Global function middleware - runs on every server function
-const globalFunctionMiddleware = createMiddleware({ type: 'function' }).server(async ({ next }) => {
+// NOTE: This is exported unwrapped to test auto-instrumentation via the Vite plugin
+export const globalFunctionMiddleware = createMiddleware({ type: 'function' }).server(async ({ next }) => {
  console.log('Global function middleware executed');
  return next();
 });
@@ -37,17 +39,13 @@ const errorMiddleware = createMiddleware({ type: 'function' }).server(async () =
  throw new Error('Middleware Error Test');
 });
 
-// Manually wrap middlewares with Sentry
+// Manually wrap middlewares with Sentry (for middlewares that won't be auto-instrumented)
 export const [
- wrappedGlobalRequestMiddleware,
- wrappedGlobalFunctionMiddleware,
  wrappedServerFnMiddleware,
  wrappedServerRouteRequestMiddleware,
  wrappedEarlyReturnMiddleware,
  wrappedErrorMiddleware,
 ] = wrapMiddlewaresWithSentry({
- globalRequestMiddleware,
- globalFunctionMiddleware,
  serverFnMiddleware,
  serverRouteRequestMiddleware,
  earlyReturnMiddleware,

dev-packages/e2e-tests/test-applications/tanstackstart-react/src/start.ts

@@ -1,9 +1,10 @@
 import { createStart } from '@tanstack/react-start';
-import { wrappedGlobalRequestMiddleware, wrappedGlobalFunctionMiddleware } from './middleware';
+// NOTE: These are NOT wrapped - auto-instrumentation via the Vite plugin will wrap them
+import { globalRequestMiddleware, globalFunctionMiddleware } from './middleware';
 
 export const startInstance = createStart(() => {
  return {
- requestMiddleware: [wrappedGlobalRequestMiddleware],
- functionMiddleware: [wrappedGlobalFunctionMiddleware],
+ requestMiddleware: [globalRequestMiddleware],
+ functionMiddleware: [globalFunctionMiddleware],
  };
 });

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

@@ -0,0 +1,119 @@
+import type { Plugin } from 'vite';
+
+type AutoInstrumentMiddlewareOptions = {
+ enabled?: boolean;
+ debug?: boolean;
+};
+
+/**
+ * A Vite plugin that automatically instruments TanStack Start middlewares
+ * by wrapping `requestMiddleware` and `functionMiddleware` arrays in `createStart()`.
+ */
+export function makeAutoInstrumentMiddlewarePlugin(options: AutoInstrumentMiddlewareOptions = {}): Plugin {
+ const { enabled = true, debug = false } = options;
+
+ return {
+ name: 'sentry-tanstack-middleware-auto-instrument',
+ enforce: 'pre',
+
+ transform(code, id) {
+ if (!enabled) {
+ return null;
+ }
+
+ // Skip if not a TS/JS file
+ if (!/\.(ts|tsx|js|jsx|mjs|mts)$/.test(id)) {
+ return null;
+ }
+
+ // Only wrap requestMiddleware and functionMiddleware in createStart()
+ // createStart() should always be in a file named start.ts
+ if (!id.includes('start') || !code.includes('createStart(')) {
+ return null;
+ }
+
+ // Skip if the user already did some manual wrapping
+ if (code.includes('wrapMiddlewaresWithSentry')) {
+ return null;
+ }
+
+ let transformed = code;
+ let needsImport = false;
+ const skippedMiddlewares: string[] = [];
+
+ transformed = transformed.replace(
+ /(requestMiddleware|functionMiddleware)\s*:\s*\[([^\]]*)\]/g,
+ (match: string, key: string, contents: string) => {
+ const objContents = arrayToObjectShorthand(contents);
+ if (objContents) {
+ needsImport = true;
+ if (debug) {
+ // eslint-disable-next-line no-console
+ console.log(`[Sentry] Auto-wrapping ${key} in ${id}`);
+ }
+ return `${key}: wrapMiddlewaresWithSentry(${objContents})`;
+ }
+ // Track middlewares that couldn't be auto-wrapped
+ // Skip if we matched whitespace only
+ if (contents.trim()) {
+ skippedMiddlewares.push(key);
+ }
+ return match;
+ },
+ );
+
+ // Warn about middlewares that couldn't be auto-wrapped
+ if (skippedMiddlewares.length > 0) {
+ // eslint-disable-next-line no-console
+ console.warn(
+ `[Sentry] Could not auto-instrument ${skippedMiddlewares.join(' and ')} in ${id}. ` +
+ 'To instrument these middlewares, use wrapMiddlewaresWithSentry() manually. ',
+ );
+ }
+
+ // We didn't wrap any middlewares, so we don't need to import the wrapMiddlewaresWithSentry function
+ if (!needsImport) {
+ return null;
+ }
+
+ const sentryImport = "import { wrapMiddlewaresWithSentry } from '@sentry/tanstackstart-react';\n";
+
+ // Check for 'use server' or 'use client' directives, these need to be before any imports
+ const directiveMatch = transformed.match(/^(['"])use (client|server)\1;?\s*\n?/);
+ if (directiveMatch) {
+ // Insert import after the directive
+ const directive = directiveMatch[0];
+ transformed = directive + sentryImport + transformed.slice(directive.length);
+ } else {
+ transformed = sentryImport + transformed;
+ }
+
+ return { code: transformed, map: null };
+ },
+ };
+}
+
+/**
+ * Convert array contents to object shorthand syntax.
+ * e.g., "foo, bar, baz" → "{ foo, bar, baz }"
+ *
+ * Returns null if contents contain non-identifier expressions (function calls, etc.)
+ * which cannot be converted to object shorthand.
+ */
+export function arrayToObjectShorthand(contents: string): string | null {
+ const items = contents
+ .split(',')
+ .map(s => s.trim())
+ .filter(Boolean);
+
+ // Only convert if all items are valid identifiers (no complex expressions)
+ const allIdentifiers = items.every(item => /^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(item));
+ if (!allIdentifiers || items.length === 0) {
+ return null;
+ }
+
+ // Deduplicate to avoid invalid syntax like { foo, foo }
+ const uniqueItems = [...new Set(items)];
+
+ return `{ ${uniqueItems.join(', ')} }`;
+}

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

@@ -1 +1,2 @@
 export { sentryTanstackStart } from './sentryTanstackStart';
+export type { SentryTanstackStartOptions } from './sentryTanstackStart';

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

@@ -1,7 +1,26 @@
 import type { BuildTimeOptionsBase } from '@sentry/core';
 import type { Plugin } from 'vite';
+import { makeAutoInstrumentMiddlewarePlugin } from './autoInstrumentMiddleware';
 import { makeAddSentryVitePlugin, makeEnableSourceMapsVitePlugin } from './sourceMaps';
 
+/**
+ * Build-time options for the Sentry TanStack Start SDK.
+ */
+export interface SentryTanstackStartOptions extends BuildTimeOptionsBase {
+ /**
+ * If this flag is `true`, the Sentry plugins will automatically instrument TanStack Start middlewares.
+ *
+ * This wraps global middlewares (`requestMiddleware` and `functionMiddleware`) in `createStart()` with Sentry
+ * instrumentation to capture performance data.
+ *
+ * Set to `false` to disable automatic middleware instrumentation if you prefer to wrap middlewares manually
+ * using `wrapMiddlewaresWithSentry`.
+ *
+ * @default true
+ */
+ autoInstrumentMiddleware?: boolean;
+}
+
 /**
  * Vite plugins for the Sentry TanStack Start SDK.
  *
@@ -14,26 +33,32 @@ import { makeAddSentryVitePlugin, makeEnableSourceMapsVitePlugin } from './sourc
  *
  * export default defineConfig({
  * plugins: [
+ * tanstackStart(),
  * sentryTanstackStart({
  * org: 'your-org',
  * project: 'your-project',
  * }),
- * tanstackStart(),
  * ],
  * });
  * ```
  *
  * @param options - Options to configure the Sentry Vite plugins
  * @returns An array of Vite plugins
  */
-export function sentryTanstackStart(options: BuildTimeOptionsBase = {}): Plugin[] {
- // Only add plugins in production builds
+export function sentryTanstackStart(options: SentryTanstackStartOptions = {}): Plugin[] {
+ // only add plugins in production builds
  if (process.env.NODE_ENV === 'development') {
  return [];
  }
 
  const plugins: Plugin[] = [...makeAddSentryVitePlugin(options)];
 
+ // middleware auto-instrumentation
+ if (options.autoInstrumentMiddleware !== false) {
+ plugins.push(makeAutoInstrumentMiddlewarePlugin({ enabled: true, debug: options.debug }));
+ }
+
+ // source maps
  const sourceMapsDisabled = options.sourcemaps?.disable === true || options.sourcemaps?.disable === 'disable-upload';
  if (!sourceMapsDisabled) {
  plugins.push(...makeEnableSourceMapsVitePlugin(options));

CHANGELOG.md

@@ -4,6 +4,24 @@
 
 - "You miss 100 percent of the chances you don't take. — Wayne Gretzky" — Michael Scott
 
+- **feat(tanstackstart-react): Auto-instrument global middleware in `sentryTanstackStart` Vite plugin ([#18884](https://github.com/getsentry/sentry-javascript/pull/18844))**
+
+ The `sentryTanstackStart` Vite plugin now automatically instruments `requestMiddleware` and `functionMiddleware` arrays in `createStart()`. This captures performance data without requiring manual wrapping.
+
+ Auto-instrumentation is enabled by default. To disable it:
+
+ ```ts
+ // vite.config.ts
+ sentryTanstackStart({
+ authToken: process.env.SENTRY_AUTH_TOKEN,
+ org: 'your-org',
+ project: 'your-project',
+ autoInstrumentMiddleware: false,
+ });
+ ```
+
+### Other Changes
+
 ## 10.36.0
 
 - feat(node): Add Prisma v7 support ([#18908](https://github.com/getsentry/sentry-javascript/pull/18908))

dev-packages/e2e-tests/test-applications/tanstackstart-react/src/middleware.ts

@@ -2,13 +2,15 @@ import { createMiddleware } from '@tanstack/react-start';
 import { wrapMiddlewaresWithSentry } from '@sentry/tanstackstart-react';
 
 // Global request middleware - runs on every request
-const globalRequestMiddleware = createMiddleware().server(async ({ next }) => {
+// NOTE: This is exported unwrapped to test auto-instrumentation via the Vite plugin
+export const globalRequestMiddleware = createMiddleware().server(async ({ next }) => {
  console.log('Global request middleware executed');
  return next();
 });
 
 // Global function middleware - runs on every server function
-const globalFunctionMiddleware = createMiddleware({ type: 'function' }).server(async ({ next }) => {
+// NOTE: This is exported unwrapped to test auto-instrumentation via the Vite plugin
+export const globalFunctionMiddleware = createMiddleware({ type: 'function' }).server(async ({ next }) => {
  console.log('Global function middleware executed');
  return next();
 });
@@ -37,17 +39,13 @@ const errorMiddleware = createMiddleware({ type: 'function' }).server(async () =
  throw new Error('Middleware Error Test');
 });
 
-// Manually wrap middlewares with Sentry
+// Manually wrap middlewares with Sentry (for middlewares that won't be auto-instrumented)
 export const [
- wrappedGlobalRequestMiddleware,
- wrappedGlobalFunctionMiddleware,
  wrappedServerFnMiddleware,
  wrappedServerRouteRequestMiddleware,
  wrappedEarlyReturnMiddleware,
  wrappedErrorMiddleware,
 ] = wrapMiddlewaresWithSentry({
- globalRequestMiddleware,
- globalFunctionMiddleware,
  serverFnMiddleware,
  serverRouteRequestMiddleware,
  earlyReturnMiddleware,

dev-packages/e2e-tests/test-applications/tanstackstart-react/src/start.ts

@@ -1,9 +1,10 @@
 import { createStart } from '@tanstack/react-start';
-import { wrappedGlobalRequestMiddleware, wrappedGlobalFunctionMiddleware } from './middleware';
+// NOTE: These are NOT wrapped - auto-instrumentation via the Vite plugin will wrap them
+import { globalRequestMiddleware, globalFunctionMiddleware } from './middleware';
 
 export const startInstance = createStart(() => {
  return {
- requestMiddleware: [wrappedGlobalRequestMiddleware],
- functionMiddleware: [wrappedGlobalFunctionMiddleware],
+ requestMiddleware: [globalRequestMiddleware],
+ functionMiddleware: [globalFunctionMiddleware],
  };
 });

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

@@ -0,0 +1,119 @@
+import type { Plugin } from 'vite';
+
+type AutoInstrumentMiddlewareOptions = {
+ enabled?: boolean;
+ debug?: boolean;
+};
+
+/**
+ * A Vite plugin that automatically instruments TanStack Start middlewares
+ * by wrapping `requestMiddleware` and `functionMiddleware` arrays in `createStart()`.
+ */
+export function makeAutoInstrumentMiddlewarePlugin(options: AutoInstrumentMiddlewareOptions = {}): Plugin {
+ const { enabled = true, debug = false } = options;
+
+ return {
+ name: 'sentry-tanstack-middleware-auto-instrument',
+ enforce: 'pre',
+
+ transform(code, id) {
+ if (!enabled) {
+ return null;
+ }
+
+ // Skip if not a TS/JS file
+ if (!/\.(ts|tsx|js|jsx|mjs|mts)$/.test(id)) {
+ return null;
+ }
+
+ // Only wrap requestMiddleware and functionMiddleware in createStart()
+ // createStart() should always be in a file named start.ts
+ if (!id.includes('start') || !code.includes('createStart(')) {
+ return null;
+ }
+
+ // Skip if the user already did some manual wrapping
+ if (code.includes('wrapMiddlewaresWithSentry')) {
+ return null;
+ }
+
+ let transformed = code;
+ let needsImport = false;
+ const skippedMiddlewares: string[] = [];
+
+ transformed = transformed.replace(
+ /(requestMiddleware|functionMiddleware)\s*:\s*\[([^\]]*)\]/g,
+ (match: string, key: string, contents: string) => {
+ const objContents = arrayToObjectShorthand(contents);
+ if (objContents) {
+ needsImport = true;
+ if (debug) {
+ // eslint-disable-next-line no-console
+ console.log(`[Sentry] Auto-wrapping ${key} in ${id}`);
+ }
+ return `${key}: wrapMiddlewaresWithSentry(${objContents})`;
+ }
+ // Track middlewares that couldn't be auto-wrapped
+ // Skip if we matched whitespace only
+ if (contents.trim()) {
+ skippedMiddlewares.push(key);
+ }
+ return match;
+ },
+ );
+
+ // Warn about middlewares that couldn't be auto-wrapped
+ if (skippedMiddlewares.length > 0) {
+ // eslint-disable-next-line no-console
+ console.warn(
+ `[Sentry] Could not auto-instrument ${skippedMiddlewares.join(' and ')} in ${id}. ` +
+ 'To instrument these middlewares, use wrapMiddlewaresWithSentry() manually. ',
+ );
+ }
+
+ // We didn't wrap any middlewares, so we don't need to import the wrapMiddlewaresWithSentry function
+ if (!needsImport) {
+ return null;
+ }
+
+ const sentryImport = "import { wrapMiddlewaresWithSentry } from '@sentry/tanstackstart-react';\n";
+
+ // Check for 'use server' or 'use client' directives, these need to be before any imports
+ const directiveMatch = transformed.match(/^(['"])use (client|server)\1;?\s*\n?/);
+ if (directiveMatch) {
+ // Insert import after the directive
+ const directive = directiveMatch[0];
+ transformed = directive + sentryImport + transformed.slice(directive.length);
+ } else {
+ transformed = sentryImport + transformed;
+ }
+
+ return { code: transformed, map: null };
+ },
+ };
+}
+
+/**
+ * Convert array contents to object shorthand syntax.
+ * e.g., "foo, bar, baz" → "{ foo, bar, baz }"
+ *
+ * Returns null if contents contain non-identifier expressions (function calls, etc.)
+ * which cannot be converted to object shorthand.
+ */
+export function arrayToObjectShorthand(contents: string): string | null {
+ const items = contents
+ .split(',')
+ .map(s => s.trim())
+ .filter(Boolean);
+
+ // Only convert if all items are valid identifiers (no complex expressions)
+ const allIdentifiers = items.every(item => /^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(item));
+ if (!allIdentifiers || items.length === 0) {
+ return null;
+ }
+
+ // Deduplicate to avoid invalid syntax like { foo, foo }
+ const uniqueItems = [...new Set(items)];
+
+ return `{ ${uniqueItems.join(', ')} }`;
+}

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

@@ -1 +1,2 @@
 export { sentryTanstackStart } from './sentryTanstackStart';
+export type { SentryTanstackStartOptions } from './sentryTanstackStart';

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

@@ -1,7 +1,26 @@
 import type { BuildTimeOptionsBase } from '@sentry/core';
 import type { Plugin } from 'vite';
+import { makeAutoInstrumentMiddlewarePlugin } from './autoInstrumentMiddleware';
 import { makeAddSentryVitePlugin, makeEnableSourceMapsVitePlugin } from './sourceMaps';
 
+/**
+ * Build-time options for the Sentry TanStack Start SDK.
+ */
+export interface SentryTanstackStartOptions extends BuildTimeOptionsBase {
+ /**
+ * If this flag is `true`, the Sentry plugins will automatically instrument TanStack Start middlewares.
+ *
+ * This wraps global middlewares (`requestMiddleware` and `functionMiddleware`) in `createStart()` with Sentry
+ * instrumentation to capture performance data.
+ *
+ * Set to `false` to disable automatic middleware instrumentation if you prefer to wrap middlewares manually
+ * using `wrapMiddlewaresWithSentry`.
+ *
+ * @default true
+ */
+ autoInstrumentMiddleware?: boolean;
+}
+
 /**
  * Vite plugins for the Sentry TanStack Start SDK.
  *
@@ -14,26 +33,32 @@ import { makeAddSentryVitePlugin, makeEnableSourceMapsVitePlugin } from './sourc
  *
  * export default defineConfig({
  * plugins: [
+ * tanstackStart(),
  * sentryTanstackStart({
  * org: 'your-org',
  * project: 'your-project',
  * }),
- * tanstackStart(),
  * ],
  * });
  * ```
  *
  * @param options - Options to configure the Sentry Vite plugins
  * @returns An array of Vite plugins
  */
-export function sentryTanstackStart(options: BuildTimeOptionsBase = {}): Plugin[] {
- // Only add plugins in production builds
+export function sentryTanstackStart(options: SentryTanstackStartOptions = {}): Plugin[] {
+ // only add plugins in production builds
  if (process.env.NODE_ENV === 'development') {
  return [];
  }
 
  const plugins: Plugin[] = [...makeAddSentryVitePlugin(options)];
 
+ // middleware auto-instrumentation
+ if (options.autoInstrumentMiddleware !== false) {
+ plugins.push(makeAutoInstrumentMiddlewarePlugin({ enabled: true, debug: options.debug }));
+ }
+
+ // source maps
  const sourceMapsDisabled = options.sourcemaps?.disable === true || options.sourcemaps?.disable === 'disable-upload';
  if (!sourceMapsDisabled) {
  plugins.push(...makeEnableSourceMapsVitePlugin(options));