16 mois après la sortie de la v2, Vite 3.0 est désormais officiellement sorti . L'annonce note que l'adoption de Vite 2 a augmenté depuis sa sortie en février dernier ; avec plus d'un million de téléchargements npm par semaine, un énorme écosystème s'est rapidement formé. Vite est à l'origine d'une nouvelle vague d'innovation dans les frameworks Web.
"Nous avons décidé de publier une nouvelle version majeure de Vite au moins une fois par an pour coïncider avec l'EOL de Node.js, et en profiter pour revoir régulièrement l'API de Vite afin de fournir un chemin de migration court pour les projets de l'écosystème."
Les mises à jour Vite 3.0 incluent principalement :
nouveau document
La nouvelle documentation v3 est disponible sur vitejs.dev . Vite utilise désormais le nouveau thème par défaut de VitePress avec un mode sombre entre autres fonctionnalités.
Plusieurs projets de l'écosystème ont migré ici (voir Vitest , vite-plugin-pwa et VitePress lui-même). Si vous avez besoin d'accéder à la documentation Vite 2, ils resteront dans v2.vitejs.dev . Il existe également un nouveau sous-domaine main.vitejs.dev où chaque commit sur la branche maître Vite est automatiquement déployé. Ceci est utile lorsque vous testez des versions bêta ou contribuez au développement de base.
En plus d'ajouter une traduction officielle en espagnol :
Créer des modèles de démarrage Vite
Le modèle create-vite est un excellent outil pour tester rapidement Vite avec votre framework préféré. Dans Vite 3, tous les modèles ont un nouveau thème qui s'aligne sur la nouvelle documentation. Ouvrez-les en ligne et commencez à utiliser Vite 3 dès aujourd'hui :
Tous les modèles partagent désormais ce thème. Pour une solution plus complète comprenant le peluchage, la configuration des tests et d'autres fonctionnalités ; il existe des modèles officiels alimentés par Vite pour certains frameworks tels que create-vue et create-svelte . Il existe une liste de modèles gérée par la communauté sur Awesome Vite .
amélioration du développement
Vite CLI
VITE v3.0.0 prêt en 320 ms ➜ Local : http://127.0.0.1:5173/ ➜ Réseau : utilisez --host pour exposer
En plus des améliorations esthétiques apportées à la CLI, le port du serveur de développement par défaut est désormais 5173 et le serveur de prévisualisation écoute sur le port 4173. Ce changement garantira que Vite évitera les conflits avec d'autres outils.
Stratégie de connexion WebSocket améliorée
L'un des points faibles du Vite 2 était la configuration du serveur lorsqu'il s'exécutait derrière un proxy. Vite 3 modifie le schéma de connexion par défaut afin qu'il fonctionne immédiatement dans la plupart des cas. Tous ces paramètres sont maintenant vite-setup-cataloguetestés dans le cadre de Vite Ecosystem CI.
Améliorations du démarrage à froid
Vite évite désormais un rechargement complet lors d'un démarrage à froid lorsque le plugin injecte des importations lors de la saisie d'un module initialement importé de manière statique ( #8869 ).
import.meta.glob
import.meta.globLe support a été réécrit. Lisez les nouveautés du Glob Import Guide :
Plusieurs modèles peuvent être passés sous forme de tableau
import.meta.glob(['./dir/*.js', './another/*.js']) Les modèles négatifs ( préfixés par) sont désormais pris en charge pour ignorer certains fichiers spécifiques!
import.meta.glob(['./dir/*.js', '!**/bar.js']) Des importations nommées peuvent être spécifiées pour améliorer l'arborescence
import.meta.glob('./dir/*.js', { import: 'setup' }) Vous pouvez joindre des métadonnées par requête personnalisée
import.meta.glob('./dir/*.js', { query: { custom: 'data' } }) Les importations impatientes sont désormais transmises comme un indicateur
import.meta.glob('./dir/*.js', { eager: true }) Aligner l'importation WASM avec les futures normes
L'API d' importation WebAssembly a été révisée pour éviter les conflits avec les normes futures et la rendre plus flexible :
import init from './example.wasm?init'
init().then((instance) => {
instance.exports.test()
})
En savoir plus dans le guide WebAssembly .
Construire des améliorations
Version par défaut d'ESM SSR
La plupart des cadres SSR de l'écosystème sont déjà construits à l'aide d'ESM. Par conséquent, Vite 3 fait d'ESM le format par défaut pour les builds SSR. Cela permet de simplifier la précédente heuristique d'externalisation SSR , externalisant les dépendances par défaut.
Prise en charge améliorée de la base relative
Vite 3 prend désormais correctement en charge les bases relatives (à l'aide de base: ''), permettant aux actifs construits d'être déployés sur différentes bases sans reconstruction. Ceci est utile lorsque la base n'est pas connue au moment de la construction, comme lors du déploiement sur un réseau adressable par le contenu tel que IPFS .
Réduire la taille du paquet
Vite regroupe la plupart de ses dépendances et essaie d'utiliser des alternatives modernes et légères dans la mesure du possible. La taille de sortie du Vite 3 est 30% plus petite que celle du V2.
correction d'un bug
Au cours des trois derniers mois, les problèmes ouverts de Vite sont passés de 770 à 400.
Notes de compatibilité
- Vite ne prend plus en charge Node.js 12 qui a atteint la fin de vie. Node.js 14.18+ est maintenant requis.
- Vite est maintenant publié en tant qu'ESM et, pour des raisons de compatibilité, un proxy CJS a été ajouté à l'entrée ESM.
- La ligne de base du navigateur moderne cible désormais les navigateurs prenant en charge les modules ES natifs , les importations dynamiques ESM natives et les fonctionnalités des navigateurs prenant en charge les modules ES natifs , les importations dynamiques ESM natives et les
import.metafonctionnalités. - Les extensions de fichier JS en mode SSR et bibliothèque utilisent désormais une extension valide (js, mjs ou cjs) pour générer des entrées et des morceaux JS en fonction de leur format et de leur type de package.
En savoir plus dans le guide de migration .