turbopack

Migrate webpack configuration to Turbopack in Next.js 16 by moving custom resolve aliases and extension resolution into the top-level turbopack config block within next.config.ts. This ensures local development and production builds remain stable during bundler migration.

CSS Modules builds fail after switching to Turbopack due to CSS ordering differences and unsupported PostCSS or Sass configurations. Turbopack handles global CSS and CSS Modules differently than webpack, requiring specific migration workarounds for correct stylesheet compilation.

Diagnose HMR and build bottlenecks in Turbopack by profiling build diagnostics and checking for unsupported configuration mismatches. Targeted troubleshooting identifies environment-boundary errors between server-only and client code that cause performance degradation during local development.

Fall back to webpack instead of using Turbopack when you require unsupported loader or plugin equivalents that lack Turbopack parity. Validate output differences across bundlers to determine if specific webpack customization patterns are necessary for your production build.

Turbopack supports environment boundary handling for server-only and client code through proper next.config.ts syntax. Safe environment boundary handling prevents build failures caused by Webpack-to-Turbopack configuration mismatches during local development and production builds.

Fix unsupported loader errors in Turbopack by identifying missing loader equivalents and applying webpack parity workarounds. Use deterministic migration of webpack customization patterns to Turbopack rules, or fall back to webpack when specific plugins are unavailable.