▲ Next.js Intermediate

How does the Next.js build process work?

Answer

The Next.js build process (next build) compiles and optimizes the application for production: Build output directory: .next/ contains all build artifacts. Build steps: (1) TypeScript compilation and type checking; (2) ESLint linting; (3) Static analysis — Next.js analyzes each route to determine: static (pre-render at build time), ISR (pre-render + revalidation), or dynamic (render at runtime); (4) Static generation — Next.js runs generateStaticParams for dynamic routes and pre-renders all static routes; (5) JavaScript bundling with Webpack/Turbopack — code splitting, tree shaking, minification; (6) CSS optimization — PostCSS, Tailwind purging; (7) Image optimization setup; (8) Route manifest generation. Build output indicators: Static, ISR (with revalidate), λ Serverless (dynamic). Output modes: output: "standalone" — includes only necessary files for production (no node_modules), great for Docker; output: "export" — full static export (no server required). Analyzing bundle size: ANALYZE=true next build with @next/bundle-analyzer generates a visual treemap of bundle composition. Build caching: .next/cache/ preserves incremental compilation results between builds — unchanged code reuses cached compilation. Deployment: Vercel deploys automatically; self-host with node .next/standalone/server.js or Docker. next start starts the production server.