Turbopack

Turbopack (Beta) ist ein inkrementeller Bundler, optimiert für JavaScript und TypeScript, in Rust geschrieben und in Next.js integriert.

Verwendung

Turbopack kann in Next.js sowohl im pages- als auch im app-Verzeichnis für eine schnellere lokale Entwicklung verwendet werden. Um Turbopack zu aktivieren, verwenden Sie das Flag --turbo beim Starten des Next.js-Entwicklungsservers.

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

Unterstützte Funktionen

Turbopack in Next.js erfordert für die meisten Nutzer keine Konfiguration und kann für fortgeschrittene Anwendungsfälle erweitert werden. Um mehr über die derzeit unterstützten Funktionen von Turbopack zu erfahren, sehen Sie sich die API-Referenz an.

Nicht unterstützte Funktionen

Turbopack unterstützt derzeit nur next dev und nicht next build. Wir arbeiten derzeit an der Unterstützung für Builds, während wir uns der Stabilität nähern.

Diese Funktionen werden derzeit nicht unterstützt:

• webpack()-Konfiguration in next.config.js
  • Turbopack ersetzt Webpack, was bedeutet, dass die Webpack-Konfiguration nicht unterstützt wird.
  • Um Turbopack zu konfigurieren, siehe die Dokumentation.
  • Eine Teilmenge der Webpack-Loader wird in Turbopack unterstützt.
• Babel (.babelrc)
  • Turbopack nutzt den SWC-Compiler für alle Transpilierungen und Optimierungen. Das bedeutet, dass Babel standardmäßig nicht enthalten ist.
  • Wenn Sie eine .babelrc-Datei haben, benötigen Sie diese möglicherweise nicht mehr, da Next.js gängige Babel-Plugins als SWC-Transforms enthält, die aktiviert werden können. Mehr dazu finden Sie in der Compiler-Dokumentation.
  • Falls Sie Babel dennoch benötigen, nachdem Sie überprüft haben, dass Ihr spezieller Anwendungsfall nicht abgedeckt ist, können Sie die Unterstützung für benutzerdefinierte Webpack-Loader von Turbopack nutzen, um babel-loader einzubinden.
• Automatisches Erstellen eines Root-Layouts im App Router.
  • Dieses Verhalten wird derzeit nicht unterstützt, da es Eingabedateien ändert. Stattdessen wird ein Fehler angezeigt, der Sie auffordert, manuell ein Root-Layout am gewünschten Ort hinzuzufügen.
• @next/font (veraltete Schriftarten-Unterstützung).
  • @next/font ist veraltet zugunsten von next/font. next/font wird vollständig mit Turbopack unterstützt.
• new Worker('file', import.meta.url).
  • Dies soll in Zukunft implementiert werden.
• Relay-Transforms
  • Dies soll in Zukunft implementiert werden.
• experimental.nextScriptWorkers
  • Dies soll in Zukunft implementiert werden.
• AMP.
  • Derzeit ist keine Unterstützung für AMP in Next.js mit Turbopack geplant.
• Yarn PnP
  • Derzeit ist keine Unterstützung für Yarn PnP in Next.js mit Turbopack geplant.
• experimental.urlImports
  • Derzeit ist keine Unterstützung für experimental.urlImports in Next.js mit Turbopack geplant.

Erstellung von Trace-Dateien

Trace-Dateien ermöglichen es dem Next.js-Team, Leistungsmetriken und Speichernutzung zu untersuchen und zu verbessern. Um eine Trace-Datei zu generieren, fügen Sie NEXT_TURBOPACK_TRACING=1 zum Befehl next dev --turbo hinzu. Dadurch wird eine .next/trace.log-Datei erstellt.

Wenn Sie Probleme im Zusammenhang mit der Leistung oder Speichernutzung von Turbopack melden, fügen Sie bitte die Trace-Datei in Ihrem GitHub-Issue bei.