_experimental.turbopackApplicationKey breaks React useEffect during SSR prerendering (Next.js 16 + Turbopack) #20101
Description
Is there an existing issue for this?
- I have checked for existing issues https://github.com/getsentry/sentry-javascript/issues
- I have reviewed the documentation https://docs.sentry.io/
- I am using the latest SDK release https://github.com/getsentry/sentry-javascript/releases
How do you use Sentry?
Sentry Saas (sentry.io)
Which SDK are you using?
@sentry/nextjs
SDK Version
10.47.0
Framework Version
Next.js 16.2.2
Link to Sentry event
No response
Reproduction Example/SDK Setup
Minimal reproduction:
https://github.com/igz0/sentry-nextjs-turbopack-gtm-repro
// next.config.ts
import { withSentryConfig } from '@sentry/nextjs';
import type { NextConfig } from 'next';
const nextConfig: NextConfig = {};
export default withSentryConfig(nextConfig, {
org: 'my-org',
project: 'my-project',
silent: true,
_experimental: {
turbopackApplicationKey: 'my-app',
},
});// sentry.client.config.ts
import * as Sentry from '@sentry/nextjs';
Sentry.init({
dsn: 'https://examplePublicKey@o0.ingest.sentry.io/0',
integrations: [
Sentry.thirdPartyErrorFilterIntegration({
filterKeys: ['my-app'],
behaviour: 'drop-error-if-contains-third-party-frames',
}),
],
});// instrumentation-client.ts
import * as Sentry from '@sentry/nextjs';
import './sentry.client.config';
export const onRouterTransitionStart = Sentry.captureRouterTransitionStart;// app/layout.tsx
import { GoogleTagManager } from '@next/third-parties/google';
export default function RootLayout({
children,
}: {
children: React.ReactNode;
}) {
return (
<html lang="en">
<body>
<GoogleTagManager gtmId="GTM-XXXXXX" />
{children}
</body>
</html>
);
}Steps to Reproduce
- Create a Next.js 16 app with Turbopack
- Install
@sentry/nextjs@10.47.0and@next/third-parties@16.2.2 - Enable
_experimental.turbopackApplicationKeyinwithSentryConfig - Configure
thirdPartyErrorFilterIntegration - Render
GoogleTagManagerfrom@next/third-parties/googleinapp/layout.tsx - Run
npm run build
Expected Result
Build completes successfully.
thirdPartyErrorFilterIntegration should work with Turbopack without breaking SSR prerendering.
Actual Result
Build fails during prerendering of /_not-found with:
Error occurred prerendering page "/_not-found". Read more: https://nextjs.org/docs/messages/prerender-error
TypeError: (0 , g.useEffect) is not a function
at c.GoogleTagManager (.next/server/chunks/ssr/_0u36dvt._.js:2:9947)
Export encountered an error on /_not-found/page: /_not-found, exiting the build.
⨯ Next.js build worker exited with code: 1 and signal: null
If I remove only this block from next.config.ts, the build succeeds again:
_experimental: {
turbopackApplicationKey: 'my-app',
},Additional Context
This seems related to the Turbopack support added for thirdPartyErrorFilterIntegration in #19320 / #19542.
I understand there was follow-up discussion in #19320 about aligning behavior with webpack by treating node_modules as first-party. However, with the current distributed implementation in @sentry/nextjs@10.47.0, enabling _experimental.turbopackApplicationKey appears to break SSR prerendering when GoogleTagManager from @next/third-parties/google is present.
In other words:
_experimental.turbopackApplicationKeyenabled: build fails_experimental.turbopackApplicationKeyremoved: build succeeds
Environment:
@sentry/nextjs: 10.47.0next: 16.2.2react: 19.2.4@next/third-parties: 16.2.2