turbopack

Configure and optimize Turbopack for Next.js development builds.

246|42|Updated Mar 4, 2026

Search Tags:#performance #optimization #nextjs #bundler #turbopack #hmr

Ready to run

npx skills add https://github.com/vercel-labs/vercel-plugin --skill turbopack

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: turbopack
Source: https://github.com/vercel-labs/vercel-plugin/tree/main/skills/turbopack
Command: npx skills add https://github.com/vercel-labs/vercel-plugin --skill turbopack

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides expert guidance on configuring and optimizing Turbopack, the Rust-powered bundler for Next.js, to significantly speed up development builds and improve HMR performance.

Core Features & Use Cases

Instant HMR: Achieve fast, consistent Hot Module Replacement regardless of project size.
Configuration Guidance: Learn how to configure Turbopack in next.config.js, including custom rules and resolve aliases.
Migration Assistance: Understand how to migrate from Webpack loaders to Turbopack's native support or custom rules.
Use Case: You're experiencing slow build times in your Next.js 16 project and want to leverage Turbopack for faster development cycles.

Quick Start

Use the turbopack skill to understand how to configure Turbopack's resolveAlias in next.config.ts.

Frequently Asked Questions about turbopack

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

FAQPage Schema

How do I configure Turbopack resolve aliases in next.config.ts?▼

You can configure Turbopack resolve aliases in next.config.ts by defining custom path mappings under the turbopack key, which enables fast Hot Module Replacement and optimized bundling for your Next.js project.

How do I migrate Webpack loaders to Turbopack for Next.js?▼

Migrate Webpack loaders to Turbopack by replacing existing loader configurations with Turbopack's native support or custom rules in next.config.js, leveraging the Rust-powered bundler for faster Next.js builds.

Why is Hot Module Replacement slow in my Next.js project and how does Turbopack help?▼

Hot Module Replacement slows down as project size increases, but Turbopack provides instant HMR through its Rust-powered architecture and file system caching, ensuring fast and consistent updates regardless of project scale.

Does Turbopack support native React Server Components and CSS handling?▼

Yes, Turbopack supports native React Server Components (RSC) and handles CSS processing directly, allowing you to leverage multi-environment builds and optimized RSC support without relying on external Webpack loaders.

What are the limitations of using Turbopack for production builds?▼

Turbopack is primarily designed to accelerate development builds and HMR, so you should carefully evaluate its production build diagnostics and ensure all required Webpack loader migrations are complete before full deployment.