Migration von v5

Environment API

Als Teil der neuen experimentellen Environment API war ein großes internes Refactoring notwendig. Vite 6 ist bestrebt, brechende Änderungen zu vermeiden, um sicherzustellen, dass die meisten Projekte schnell auf die neue Hauptversion umsteigen können. Wir werden warten, bis sich ein großer Teil des Ökosystems stabilisiert hat, um dann die Verwendung der neuen APIs zu empfehlen. Es kann einige Randfälle geben, aber diese sollten nur die Nutzung auf niedriger Ebene durch Frameworks und Tools betreffen. Wir haben mit den Maintainern im Ökosystem zusammengearbeitet, um diese Unterschiede vor der Veröffentlichung abzumildern. Bitte öffnen Sie ein Problem, wenn Sie eine Regression entdecken.

Einige interne APIs wurden aufgrund von Änderungen an der Implementierung von Vite entfernt. Wenn Sie sich auf eine von ihnen verlassen haben, erstellen Sie bitte einen feature request.

Vite Runtime API

Die experimentelle Vite Runtime API entwickelte sich zur Module Runner API, die in Vite 6 als Teil der neuen experimentellen Environment API veröffentlicht wurde. Da es sich um eine experimentelle Funktion handelte, ist die Entfernung der früheren API, die in Vite 5.1 eingeführt wurde, keine einschneidende Änderung, aber die Benutzer müssen ihre Verwendung auf das Modul-Runner-Äquivalent im Rahmen der Migration auf Vite 6 aktualisieren.

Allgemeine Änderungen

Standardwert für resolve.conditions

Diese Änderung hat keine Auswirkungen auf Benutzer, die resolve.conditions / ssr.resolve.conditions / ssr.resolve.externalConditions konfiguriert haben.

In Vite 5 war der Standardwert für resolve.conditions [] und einige Bedingungen wurden intern hinzugefügt. Der Standardwert für ssr.resolve.conditions war der Wert von resolve.conditions.

Ab Vite 6 werden einige der Bedingungen nicht mehr intern hinzugefügt und müssen in die Konfigurationswerte aufgenommen werden. Die Bedingungen, die nicht mehr intern hinzugefügt werden, sind

• resolve.conditions sind ['module', 'browser', 'development|production']
• ssr.resolve.conditions sind ['module', 'node', 'development|production']

Die Standardwerte für diese Optionen werden auf die entsprechenden Werte aktualisiert, und „ssr.resolve.conditions“ verwendet „resolve.conditions“ nicht mehr als Standardwert. Beachten Sie, dass „development|production“ eine spezielle Variable ist, die je nach Wert von „process.env.NODE_ENV“ durch „production“ oder „development“ ersetzt wird.

Wenn Sie einen benutzerdefinierten Wert für resolve.conditions oder ssr.resolve.conditions angegeben haben, müssen Sie diesen aktualisieren, um die neuen Bedingungen einzubeziehen. Wenn Sie beispielsweise zuvor ['custom'] für resolve.conditions angegeben haben, müssen Sie stattdessen ['custom', 'module', 'browser', 'development|production'] angeben.

JSON stringify

In Vite 5, wenn json.stringify: true gesetzt ist, war json.namedExports deaktiviert.

Ab Vite 6 wird json.namedExports auch dann nicht deaktiviert, wenn json.stringify: true gesetzt ist, und der Wert wird beibehalten. Wenn Sie das vorherige Verhalten erreichen wollen, können Sie json.namedExports: false setzen.

Vite 6 führt auch einen neuen Standardwert für json.stringify ein, nämlich 'auto', der nur große JSON-Dateien stringifizieren wird. Um dieses Verhalten zu deaktivieren, setzen Sie json.stringify: false.

Erweiterte Unterstützung von Asset-Referenzen in HTML-Elementen

In Vite 5 konnten nur wenige unterstützte HTML-Elemente auf Assets verweisen, die von Vite verarbeitet und gebündelt werden, wie z. B. <link href>, <img src> usw.

Vite 6 erweitert die Unterstützung auf noch mehr HTML-Elemente. Die vollständige Liste finden Sie in der Dokumentation zu den HTML-Funktionen.

Um die HTML-Verarbeitung für bestimmte Elemente zu deaktivieren, können Sie dem Element das Attribut vite-ignore hinzufügen.

postcss-load-config

postcss-load-config wurde von v4 auf v6 aktualisiert. tsx oder jiti wird nun benötigt, um TypeScript postcss-Konfigurationsdateien zu laden, anstatt ts-node. Auch yaml wird nun benötigt, um YAML postcss Konfigurationsdateien zu laden.

Sass verwendet jetzt standardmäßig die moderne API

In Vite 5 wurde standardmäßig die Legacy-API für Sass verwendet. Vite 5.4 fügte Unterstützung für die moderne API hinzu.

Ab Vite 6 wird die moderne API standardmäßig für Sass verwendet. Wenn Sie weiterhin die Legacy-API verwenden möchten, können Sie css.preprocessorOptions.sass.api: 'legacy' / css.preprocessorOptions.scss.api: 'legacy' einstellen. Beachten Sie jedoch, dass die Unterstützung der Legacy-API in Vite 7 entfernt wird.

Um zur modernen API zu migrieren, lesen Sie bitte die Sass-Dokumentation.

CSS-Ausgabedateinamen im Bibliotheksmodus anpassen

In Vite 5 lautete der CSS-Ausgabedateiname im Bibliotheksmodus immer „style.css“ und konnte nicht ohne Weiteres über die Vite-Konfiguration geändert werden.

Ab Vite 6 wird für den Standarddateinamen nun „name“ aus „package.json“ verwendet, ähnlich wie bei den JS-Ausgabedateien. Wenn build.lib.fileName mit einer Zeichenfolge festgelegt ist, wird dieser Wert auch für den Namen der CSS-Ausgabedatei verwendet. Um explizit einen anderen CSS-Dateinamen festzulegen, können Sie die neue Option build.lib.cssFileName verwenden.

Wenn Sie sich bisher auf den Dateinamen style.css verlassen haben, sollten Sie für die Migration die Verweise darauf auf den neuen Namen basierend auf Ihrem Paketnamen aktualisieren. Beispiel:

package.json

{
  "name": "my-lib",
  "exports": {
    "./style.css": "./dist/style.css"
    "./style.css": "./dist/my-lib.css"
  }
}

Wenn Sie wie in Vite 5 lieber bei style.css bleiben möchten, können Sie stattdessen build.lib.cssFileName: 'style' festlegen.

Erweitert

Es gibt weitere Änderungen, die nur wenige Benutzer betreffen.

• [#15637] fix!: default build.cssMinify to 'esbuild' for SSR
  • build.cssMinify is now enabled by default even for SSR builds.
• [#18070] feat!: proxy bypass with WebSocket
  • server.proxy[path].bypass is now called for WebSocket upgrade requests and in that case, the res parameter will be undefined.
• [#18209] refactor!: bump minimal terser version to 5.16.0
  • Minimal supported terser version for build.minify: 'terser' was bumped to 5.16.0 from 5.4.0.
• [#18231] chore(deps): update dependency @rollup/plugin-commonjs to v28
  • commonjsOptions.strictRequires is now true by default (was 'auto' before).
• [#18243] chore(deps)!: migrate fast-glob to tinyglobby
  • Range braces ({01..03} ⇒ ['01', '02', '03']) and incremental braces ({2..8..2} ⇒ ['2', '4', '6', '8']) are no longer supported in globs.
• [#18493] refactor!: remove fs.cachedChecks option
  • This opt-in optimization was removed due to edge cases when writing a file in a cached folder and immediately importing it.

Migration von v4

Schauen Sie sich zuerst den Migration from v4 Guide in den Vite v5 Docs an, um zu sehen, welche Änderungen notwendig sind, um Ihre Anwendung auf Vite 5 zu portieren, und fahren Sie dann mit den Änderungen auf dieser Seite fort.