Skip to content

Conversation

jimmcq
Copy link
Owner

@jimmcq jimmcq commented Sep 29, 2025

Summary

Resolves critical build failure caused by outdated Sentry configuration incompatible with Next.js 15 App Router.

Problem

Build was failing with:

Error: <Html> should not be imported outside of pages/_document

Root Cause: Deprecated Sentry config files using Pages Router patterns incompatible with App Router.

Changes

New Files

  • src/instrumentation.ts - Server-side Sentry initialization
  • src/instrumentation-client.ts - Client-side Sentry initialization
  • src/app/global-error.tsx - Custom global error handler
  • src/app/not-found.tsx - Custom 404 page

Modified Files

  • src/app/layout.tsx - Removed old Sentry import
  • next.config.ts - Temporarily disabled withSentryConfig wrapper (documented)
  • package.json - Updated Sentry to v10.16.0

Removed Files

  • sentry.client.config.ts (deprecated)
  • sentry.server.config.ts (deprecated)
  • sentry.edge.config.ts (deprecated)

Technical Details

  • Migrated from deprecated config files to Next.js 15 instrumentation hooks
  • Added onRequestError and onRouterTransitionStart exports
  • Implemented custom error boundaries compatible with App Router
  • Sentry wrapper temporarily disabled due to known compatibility issue

Testing

  • ✅ Production build passes: yarn build:ci
  • ✅ All 254 tests passing
  • ✅ TypeScript compilation successful
  • ✅ ESLint passing
  • ✅ All pre-commit hooks passed

Note on Sentry Wrapper

The withSentryConfig wrapper is temporarily disabled due to a known issue where Sentry v10 generates Pages Router error pages incompatible with Next.js 15 App Router. The instrumentation files work correctly for error tracking; only the build-time wrapper needs to be re-enabled once Sentry releases a fix.

Tracking: getsentry/sentry-javascript#14526

References

Resolves critical build failure caused by outdated Sentry configuration
incompatible with Next.js 15 App Router.

Changes:
- Created src/instrumentation.ts for server-side Sentry initialization
- Created src/instrumentation-client.ts for client-side initialization
- Added src/app/global-error.tsx to handle React rendering errors
- Added src/app/not-found.tsx for custom 404 page
- Removed deprecated sentry.*.config.ts files
- Updated Sentry packages to v10.16.0
- Removed old Sentry import from layout.tsx

Technical Details:
- Sentry's withSentryConfig wrapper temporarily disabled due to Next.js 15
  compatibility issue (generates Pages Router error pages incompatible with
  App Router)
- Implemented manual instrumentation hooks following Next.js App Router
  patterns
- Added onRequestError and onRouterTransitionStart exports
- Build now succeeds with proper NODE_ENV=production

Testing:
- ✅ Production build passes (yarn build:ci)
- ✅ All 254 tests passing
- ✅ TypeScript compilation successful
- ⚠️  ESLint warning in useMartianTime.ts (pre-existing, tracked separately)

References:
- https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/
- getsentry/sentry-javascript#14526
Remove the old sentry.*.config.ts files that are no longer needed
after migrating to Next.js 15 App Router instrumentation pattern.

These files have been replaced by:
- src/instrumentation.ts (server-side)
- src/instrumentation-client.ts (client-side)
@jimmcq jimmcq merged commit ef5f69f into main Sep 29, 2025
3 checks passed
@jimmcq jimmcq deleted the fix/sentry-app-router-configuration branch September 29, 2025 22:01
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant