nextjs-turbopack

Configure Next.js 16+ to use Turbopack as the default bundler.

Updated Mar 21, 2026

Search Tags:#nextjs #webpack #turbopack #hot-module-replacement #dev-speed #framework-optimization

Ready to run

npx skills add https://github.com/hieuck/Pro5ChromeManager --skill nextjs-turbopack-hieuck

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: nextjs-turbopack
Source: https://github.com/hieuck/Pro5ChromeManager/tree/main/.cursor/skills/nextjs-turbopack
Command: npx skills add https://github.com/hieuck/Pro5ChromeManager --skill nextjs-turbopack-hieuck

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Next.js 16+ uses Turbopack by default for local development: an incremental bundler written in Rust that significantly speeds up dev startup and hot updates.

Core Features & Use Cases

Turbopack (default dev): Use for day-to-day development. Faster cold start and HMR, especially in large apps.
Webpack (legacy dev): Use only if you hit a Turbopack bug or rely on a webpack-only plugin in dev. Disable with --webpack (or --no-turbopack depending on Next.js version; check the docs for your release).
Production: Production build behavior (next build) may use Turbopack or webpack depending on Next.js version; check the official Next.js docs for your version.
Use when: developing or debugging Next.js 16+ apps, diagnosing slow dev startup or HMR, or optimizing production bundles.

Quick Start

Use the next dev to start local development with Turbopack.

Frequently Asked Questions about nextjs-turbopack

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I speed up Next.js dev startup and HMR?▼

To speed up Next.js dev startup and HMR, use Turbopack as the default bundler for local development in Next.js 16+. Turbopack is an incremental bundler written in Rust that significantly improves cold start and hot update speeds.

What is Turbopack in Next.js 16+?▼

Turbopack in Next.js 16+ is an incremental bundler written in Rust that serves as the default for local development. It significantly speeds up dev startup and hot updates compared to previous webpack-based setups.

How to enable Turbopack for Next.js local development?▼

To enable Turbopack for Next.js local development, simply use the `next dev` command in a Next.js 16+ project. Turbopack is enabled by default, requiring no additional configuration for faster startup and HMR.

Does Next.js 16+ still support webpack for legacy dev setups?▼

Next.js 16+ does support webpack for legacy dev setups by disabling Turbopack. Use the `--webpack` or `--no-turbopack` flag depending on your Next.js release to toggle behavior when hitting Turbopack bugs or relying on webpack-only plugins.

When should I disable Turbopack and use webpack in Next.js?▼

You should disable Turbopack and use webpack in Next.js when you hit a Turbopack bug or rely on a webpack-only plugin during development. Toggle this behavior using the `--webpack` or `--no-turbopack` flag.

Can I use Turbopack for Next.js production builds?▼

Production build behavior using `next build` may use Turbopack or webpack depending on your specific Next.js version. You should check the official Next.js documentation for your release to verify production bundling behavior.