La chaîne d'outils de build JavaScript passe au natif. Le 12 mars 2026, Vite 8 est sorti avec Rolldown — un bundler écrit en Rust — comme moteur unique par défaut, remplaçant à la fois esbuild et Rollup. Les équipes rapportent des builds de production passant de 46 secondes à 6, et une latence HMR chutant de 200 ms à moins de 30. Ce guide vous accompagne, étape par étape, dans la migration sécurisée d'un projet existant.
Ce que vous allez apprendre
À la fin de ce guide, vous saurez :
- Comprendre ce qu'est Rolldown et pourquoi Vite a unifié son architecture autour d'un seul bundler Rust
- Choisir entre le chemin progressif (rolldown-vite sur Vite 7) et le chemin direct (Vite 8)
- Aliaser le paquet
viteet configurer les overrides du gestionnaire de paquets pour les dépendances imbriquées - Mettre à jour les options dépréciées comme
manualChunksvers la nouvelle APIadvancedChunks - Régler le moteur de plugins natifs via
experimental.enableNativePlugin - Optimiser les plugins tiers grâce à l'assistant
withFilter - Diagnostiquer et corriger les pannes de migration les plus courantes
- Vérifier et mesurer les gains de vitesse dans votre propre projet
Prérequis
Avant de commencer, assurez-vous d'avoir :
- Node.js 20.19+ ou 22.12+ installé (le minimum pour Vite 8)
- Un projet Vite 6 ou 7 existant, ou la volonté d'en créer un nouveau
- Une familiarité avec
package.json, votre gestionnaire de paquets etvite.config.ts - Un gestionnaire de paquets : pnpm (recommandé), npm, Yarn ou Bun
- Une compréhension de base des concepts de bundling (chunks, tree-shaking, HMR)
Pourquoi Rolldown ?
Pendant la majeure partie de son existence, Vite a fonctionné avec deux bundlers. En développement, il utilisait esbuild pour le pré-bundling des dépendances et les transformations ; pour les builds de production, il utilisait Rollup. Cette séparation provoquait de subtiles incohérences entre développement et build, et obligeait l'équipe à maintenir la compatibilité avec deux outils très différents.
Rolldown met fin à cette séparation. C'est un bundler unique écrit en Rust — construit par l'équipe Vite elle-même au-dessus de la chaîne d'outils Oxc — conçu pour être compatible Rollup tout en s'exécutant à la vitesse du natif. Vite 8 le livre par défaut, aux côtés d'Oxc pour les transformations JavaScript et JSX et de Lightning CSS pour la minification des feuilles de style. Tout le chemin critique est désormais en Rust.
Le bénéfice : vitesse et cohérence.
| Aspect | Vite 7 (esbuild + Rollup) | Vite 8 (Rolldown) |
|---|---|---|
| Moteur de bundling | Deux (dev et build diffèrent) | Un moteur Rust unifié |
| Build de production (Linear) | 46 s | 6 s |
| Temps de build Beehiiv | référence | réduction de 64 % |
| Latence HMR (changement typique) | 200-300 ms | 20-30 ms |
| Transformations JS/JSX | esbuild | Oxc |
| Minification CSS | esbuild / optionnel | Lightning CSS (par défaut) |
| Benchmark face à Rollup | 1x | 10 à 30 fois plus rapide |
À propos de la taille d'installation. Vite 8 occupe environ 15 Mo de plus sur le disque que Vite 7, car Rolldown (~5 Mo) et Lightning CSS (~10 Mo) sont livrés comme dépendances natives. C'est un coût ponctuel qui se rentabilise dès le premier build.
Deux chemins de migration
Il existe deux façons d'arriver à Rolldown, et la bonne dépend de la taille de votre projet :
- Mise à niveau directe vers Vite 8 — idéale pour les petites et moyennes applications et les projets neufs. Une couche de compatibilité convertit automatiquement la plupart des options esbuild et Rollup existantes, si bien que de nombreux projets passent sans aucun changement de configuration.
- Migration progressive via
rolldown-vitesur Vite 7 — idéale pour les bases de code volumineuses ou riches en plugins. Vous restez sur le comportement de Vite 7 mais remplacez le bundler par Rolldown, ce qui isole les problèmes propres à Rolldown avant d'absorber aussi les autres changements de Vite 8.
Nous couvrirons les deux. Commencez par le chemin qui correspond à votre tolérance au risque.
Étape 1 : vérifier votre version de Node.js
Vite 8 exige Node.js 20.19+ ou 22.12+. Vérifiez d'abord :
node --version
# Doit afficher v20.19.x ou plus, ou v22.12.x ou plusSi vous utilisez nvm, basculez et épinglez :
nvm install 22
nvm use 22Une version de Node obsolète est la raison la plus fréquente d'échec d'installation de Vite 8 ; réglez donc ce point avant de toucher aux dépendances.
Étape 2 (Chemin A) : migration progressive avec rolldown-vite sur Vite 7
Ce chemin vous maintient sur Vite 7 tout en intégrant le bundler Rust. L'astuce consiste à aliaser le paquet vite vers rolldown-vite dans package.json :
{
"devDependencies": {
"vite": "npm:rolldown-vite@7.1.0"
}
}Épinglez la version. N'utilisez pas @latest pour rolldown-vite. C'est une ligne de versions expérimentale, et l'épinglage vous protège des changements cassants surprises d'une installation à l'autre.
Si Vite est une dépendance de pair (peer dependency) d'autres paquets (fréquent dans les monorepos et les applications riches en plugins), l'alias seul ne suffit pas — vous devez aussi surcharger la résolution imbriquée. Utilisez la syntaxe de votre gestionnaire de paquets :
npm :
{
"overrides": {
"vite": "npm:rolldown-vite@7.1.0"
}
}pnpm :
{
"pnpm": {
"overrides": {
"vite": "npm:rolldown-vite@7.1.0"
}
}
}Yarn :
{
"resolutions": {
"vite": "npm:rolldown-vite@7.1.0"
}
}Bun :
{
"overrides": {
"vite": "npm:rolldown-vite@7.1.0"
}
}Puis réinstallez et lancez le build :
pnpm install
pnpm run buildVos scripts, votre fichier de configuration et vos plugins restent identiques. Si le build réussit et que votre application se comporte de la même manière, vous avez validé Rolldown sur votre base de code. Vous pouvez désormais passer à Vite 8 en confiance.
Étape 2 (Chemin B) : mise à niveau directe vers Vite 8
Pour un projet neuf, échafaudez directement :
pnpm create vite@latest my-app
cd my-app
pnpm install
pnpm run devLe projet généré cible déjà Vite 8 avec Rolldown par défaut — rien de plus à activer.
Pour mettre à niveau un projet existant, montez Vite et le plugin de votre framework :
pnpm add -D vite@8
# plus le plugin de votre framework, par exemple :
pnpm add -D @vitejs/plugin-react@latestSupprimez tout alias vite résiduel du Chemin A (la ligne npm:rolldown-vite@...) avant la mise à niveau, afin d'installer le véritable paquet Vite 8 plutôt que la ligne d'aperçu autonome.
Lancez le build et observez le chronométrage :
pnpm run buildGrâce à la couche de compatibilité intégrée, Vite 8 convertit automatiquement la plupart des réglages esbuild et rollupOptions existants vers leurs équivalents Rolldown et Oxc. Une large part des projets n'ont besoin d'aucune modification de configuration.
Étape 3 : mettre à jour la configuration dépréciée
Le changement de configuration le plus courant concerne le découpage manuel en chunks. La fonction manualChunks de Rollup est remplacée par l'API déclarative advancedChunks de Rolldown :
// Avant — style Rollup
export default {
build: {
rollupOptions: {
output: {
manualChunks(id) {
if (/\/react(?:-dom)?/.test(id)) {
return 'vendor'
}
}
}
}
}
}// Après — style Rolldown
export default {
build: {
rollupOptions: {
output: {
advancedChunks: {
groups: [
{ name: 'vendor', test: /\/react(?:-dom)?/ }
]
}
}
}
}
}La nouvelle API est déclarative : chaque groupe a un name et un motif test. Elle est plus facile à raisonner et permet à Rolldown de planifier les chunks à l'avance plutôt que de rappeler JavaScript pour chaque module.
Si vous importiez directement l'assistant de transformation d'esbuild, notez que transformWithEsbuild est déprécié. Utilisez à la place l'équivalent fondé sur Oxc, transformWithOxc.
Étape 4 : régler le moteur de plugins natifs
Le plus grand levier de vitesse de Vite 8, ce sont les plugins natifs — les plugins intégrés de Rolldown qui s'exécutent entièrement en Rust, sans franchir la frontière JavaScript. Cela se contrôle via experimental.enableNativePlugin, dont la valeur par défaut est 'v2' dans Vite 8 :
// vite.config.ts
import { defineConfig } from 'vite'
export default defineConfig({
experimental: {
// 'v2' est la valeur par défaut de Vite 8 — plugins natifs complets
enableNativePlugin: 'v2',
},
})Si un plugin se comporte mal en mode natif, vous pouvez abaisser le moteur d'un cran comme solution temporaire :
'v2'— plugins natifs complets (par défaut)'v1'— ensemble de plugins natifs antérieur'resolver'— désactive certains plugins natifsfalse— désactive tous les plugins natifs, au plus proche du comportement hérité
Traitez toute valeur inférieure à 'v2' comme une étape de diagnostic, pas comme une destination. Signalez le problème sous-jacent et restaurez la valeur par défaut une fois corrigé.
Étape 5 : optimiser les plugins tiers avec withFilter
Les plugins qui exécutent leur hook transform ou load sur chaque module imposent un aller-retour à travers la frontière Rust vers JavaScript, même pour des fichiers qui ne les concernent pas. L'assistant withFilter limite un plugin aux seuls fichiers qu'il doit traiter, éliminant ce surcoût :
import { defineConfig, withFilter } from 'vite'
import svgr from 'vite-plugin-svgr'
export default defineConfig({
plugins: [
withFilter(
svgr({ /* options */ }),
{ load: { id: /\.svg\?react$/ } },
),
],
})Ici, svgr ne se déclenche que pour les imports se terminant par .svg?react. Tout le reste demeure en Rust. Sur de grandes bases de code, cela seul peut faire gagner plusieurs secondes par build.
Étape 6 : gérer les aspects propres aux auteurs de plugins
Si vous maintenez votre propre plugin Vite, deux détails comptent sous Rolldown.
D'abord, lorsqu'un hook load ou transform renvoie du code à traiter comme du JavaScript, déclarez explicitement son type de module :
import fs from 'node:fs/promises'
const plugin = {
name: 'txt-loader',
async load(id) {
if (id.endsWith('.txt')) {
const content = await fs.readFile(id, 'utf-8')
return {
code: `export default ${JSON.stringify(content)}`,
moduleType: 'js',
}
}
},
}Ensuite, vous pouvez détecter si votre plugin s'exécute sous Rolldown pour bifurquer le comportement en toute sécurité :
const plugin = {
name: 'my-plugin',
resolveId() {
if (this.meta.rolldownVersion) {
// chemin spécifique à Rolldown
} else {
// chemin Rollup classique
}
},
}Ou vérifiez l'export au niveau supérieur :
import * as vite from 'vite'
if (vite.rolldownVersion) {
// code spécifique à rolldown-vite
}Étape 7 : vérifier et mesurer
La migration n'est pas terminée tant que vous n'avez pas mesuré le résultat. Chronométrez un build de production propre avant et après :
# Build propre avec chronométrage
rm -rf dist
time pnpm run buildPuis lancez votre application à partir de la sortie de production et parcourez les chemins critiques :
pnpm run previewVérifiez trois choses en particulier :
- Exactitude du build — chaque route s'affiche, les assets se chargent, aucun import cassé.
- Disposition des chunks — ouvrez
dist/assetset confirmez que vos groupesadvancedChunksont produit les séparations vendor attendues. - Ressenti du HMR — lancez
pnpm run dev, modifiez un composant et confirmez que la mise à jour arrive quasi instantanément.
Si vos chiffres ne correspondent pas aux benchmarks spectaculaires, c'est normal — les gains croissent avec la taille du projet et le nombre de modules. Même une application modeste devrait constater une amélioration nette.
Dépannage
Le build échoue avec une erreur de plugin. Abaissez enableNativePlugin à 'v1', puis 'resolver', puis false pour isoler si un plugin natif est en cause. Signalez le problème au dépôt vitejs/rolldown-vite avec une reproduction minimale.
CSS manquant en production. Certains plugins interagissent mal avec le pipeline CSS natif. Confirmez que Lightning CSS gère bien vos styles et essayez de désactiver temporairement les plugins natifs pour identifier la source.
Une dépendance de pair tire encore le Vite classique. Votre override n'a pas pris. Vérifiez bien la clé correcte pour votre gestionnaire de paquets (overrides, pnpm.overrides ou resolutions) et réinstallez à partir d'un lockfile propre.
transformWithEsbuild est indéfini. Il est déprécié sous Rolldown. Passez à transformWithOxc, ou ajoutez esbuild comme dépendance explicite si vous en avez réellement encore besoin.
La taille d'installation a bondi. C'est attendu — Rolldown et Lightning CSS ajoutent environ 15 Mo. Ce n'est pas une mauvaise configuration.
Étapes suivantes
- Parcourez le guide des fondamentaux de Vite 6 pour ancrer vos connaissances de configuration avant la migration.
- Comparez les approches de bundling avec notre tutoriel Rspack et Rsbuild — une autre option propulsée par Rust.
- Mettez en place des tests unitaires rapides avec Vitest et React Testing Library, qui partage le pipeline de transformation de Vite.
- Une fois vos builds rapides, repassez sur votre CI pour profiter des temps de build réduits.
Conclusion
Le passage de Vite 8 à Rolldown est le changement le plus important du projet depuis la version 2, et il arrive sans exiger grand-chose de la plupart des équipes. La couche de compatibilité absorbe l'essentiel du travail, vous laissant une courte liste de contrôle : confirmer Node 20.19+/22.12+, valider éventuellement via rolldown-vite sur Vite 7, migrer manualChunks vers advancedChunks, restreindre les plugins lourds avec withFilter, puis mesurer.
La récompense : un pipeline de build unifié, écrit en Rust, souvent plus rapide d'un ordre de grandeur. Pour les équipes de la région MENA qui livrent sous des budgets CI serrés et des conditions réseau lentes, ramener un build de six minutes à moins de vingt secondes n'est pas un luxe — c'est du temps de développeur récupéré à chaque push.