Turbopack

Turbopack (beta) es un empaquetador incremental optimizado para JavaScript y TypeScript, escrito en Rust e integrado en Next.js.

Uso

Turbopack puede utilizarse en Next.js tanto en los directorios pages como app para un desarrollo local más rápido. Para activar Turbopack, use el flag --turbo al ejecutar el servidor de desarrollo de Next.js.

{
  "scripts": {
    "dev": "next dev --turbo",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  }
}

Funcionalidades soportadas

Turbopack en Next.js no requiere configuración para la mayoría de usuarios y puede extenderse para casos de uso más avanzados. Para conocer las funcionalidades actualmente soportadas por Turbopack, consulte la Referencia de API.

Funcionalidades no soportadas

Turbopack actualmente solo soporta next dev y no soporta next build. Estamos trabajando en el soporte para builds a medida que nos acercamos a la estabilidad.

Estas funcionalidades no están soportadas actualmente:

• Configuración de webpack() en next.config.js
  • Turbopack reemplaza Webpack, lo que significa que la configuración de webpack no está soportada.
  • Para configurar Turbopack, consulte la documentación.
  • Un subconjunto de loaders de Webpack está soportado en Turbopack.
• Babel (.babelrc)
  • Turbopack utiliza el compilador SWC para todas las transformaciones y optimizaciones. Esto significa que Babel no está incluido por defecto.
  • Si tiene un archivo .babelrc, es posible que ya no lo necesite porque Next.js incluye plugins comunes de Babel como transformaciones SWC que pueden activarse. Puede leer más sobre esto en la documentación del compilador.
  • Si aún necesita usar Babel después de verificar que su caso de uso no está cubierto, puede aprovechar el soporte de Turbopack para loaders personalizados de webpack para incluir babel-loader.
• Creación automática de un layout raíz en App Router.
  • Este comportamiento no está soportado actualmente ya que modifica archivos de entrada. En su lugar, se mostrará un error para que agregue manualmente un layout raíz en la ubicación deseada.
• @next/font (soporte heredado para fuentes).
  • @next/font está obsoleto en favor de next/font. next/font está totalmente soportado con Turbopack.
• new Worker('file', import.meta.url).
  • Planeamos implementar esto en el futuro.
• Transformaciones Relay
  • Planeamos implementar esto en el futuro.
• experimental.nextScriptWorkers
  • Planeamos implementar esto en el futuro.
• AMP.
  • Actualmente no planeamos soportar AMP en Next.js con Turbopack.
• Yarn PnP
  • Actualmente no planeamos soportar Yarn PnP en Next.js con Turbopack.
• experimental.urlImports
  • Actualmente no planeamos soportar experimental.urlImports en Next.js con Turbopack.

Generación de archivos de traza

Los archivos de traza permiten al equipo de Next.js investigar y mejorar métricas de rendimiento y uso de memoria. Para generar un archivo de traza, añada NEXT_TURBOPACK_TRACING=1 al comando next dev --turbo, esto generará un archivo .next/trace.log.

Al reportar problemas relacionados con el rendimiento y uso de memoria de Turbopack, por favor incluya el archivo de traza en su issue de GitHub.