IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)

Vous êtes nouveau sur Developpez.com ? Créez votre compte ou connectez-vous afin de pouvoir participer !

Vous devez avoir un compte Developpez.com et être connecté pour pouvoir participer aux discussions.

Vous n'avez pas encore de compte Developpez.com ? Créez-en un en quelques instants, c'est entièrement gratuit !

Si vous disposez déjà d'un compte et qu'il est bien activé, connectez-vous à l'aide du formulaire ci-dessous.

Identifiez-vous
Identifiant
Mot de passe
Mot de passe oublié ?
Créer un compte

L'inscription est gratuite et ne vous prendra que quelques instants !

Je m'inscris !

Nuxt 4.6, le framework web full-stack libre et open source basé sur Vue.js, Nitro et Vite, arrive avec une refonte majeure de son architecture indépendante du serveur et la CLI v4

Le , par Alex

0PARTAGES

4  0 
Nuxt a officiellement publié la version 4.6, qui marque l’une de ses mises à jour mineures les plus importantes à ce jour, avec plus de 420 commits depuis la v4.5.2. Cette mise à jour représente le premier pas significatif du framework vers l’indépendance vis-à-vis du serveur. Parallèlement à Nuxt 4.6, on assiste à la sortie majeure de Nuxt CLI v4, qui nécessite désormais Node.js v22.21+, v24.11+ ou v26+. Au-delà des changements architecturaux, cette version intègre plusieurs améliorations destinées aux développeurs. Le framework inclut désormais des aides de session qui verrouillent les données dans des cookies à l’aide du chiffrement Iron, éliminant ainsi le besoin d’un stockage de session côté serveur.

Nuxt est un framework web full-stack libre et open source basé sur Vue.js, Nitro et Vite. Nuxt s'inspire de Next.js, un framework similaire basé sur React plutôt que sur la bibliothèque JavaScript Vue. Le principal avantage de Nuxt par rapport à l'utilisation de Vue seul réside dans son système de rendu universel. Le framework fonctionne à la fois comme une application monopage (SPA) dans le navigateur et comme un site web statique rendu côté serveur, en « hydratant » une page rendue côté serveur pour en faire une SPA complète une fois celle-ci chargée. Cela permet aux sites web de bénéficier des avantages en matière de référencement naturel (SEO) et de performances d’un site rendu côté serveur, tout en conservant l’interactivité d’une application rendue côté client.

Nuxt dissimule en grande partie les fonctionnalités de rendu côté serveur au développeur, offrant ainsi une expérience de développement similaire à celle d’une SPA traditionnelle utilisant le système de composants à fichier unique (SFC) de Vue. Outre son mécanisme de rendu universel, Nuxt offre également de nombreux autres avantages et fonctionnalités facilitant le quotidien, tels que le routage basé sur les chemins d’accès, le remplacement à chaud des modules (HMR), la prise en charge native de TypeScript, ainsi que des middlewares et une logique serveur. [8]

Nuxt a officiellement publié la version 4.6, qui marque l’une de ses mises à jour mineures les plus importantes à ce jour, avec plus de 420 commits depuis la v4.5.2. Cette mise à jour représente le premier pas significatif du framework vers l’indépendance vis-à-vis du serveur, une évolution conçue pour offrir aux développeurs une plus grande flexibilité dans le choix de leur infrastructure backend.

Parallèlement à Nuxt 4.6, on assiste à la sortie majeure de Nuxt CLI v4, qui nécessite désormais Node.js v22.21+, v24.11+ ou v26+. Le changement principal introduit le module nuxt/server, qui expose des utilitaires serveur tout en permettant aux équipes d’associer potentiellement Nuxt à des générateurs de serveurs autres que le moteur Nitro par défaut, y compris une implémentation expérimentale @nuxt/vite-server pour les builds pure-Vite.

Au-delà des changements architecturaux, cette version intègre plusieurs améliorations destinées aux développeurs. Le framework inclut désormais des aides de session qui verrouillent les données dans des cookies à l’aide du chiffrement Iron, éliminant ainsi le besoin d’un stockage de session côté serveur, et introduit un `runtimeConfig.appSecret` centralisé pour la gestion des secrets d’application. Sur le plan visuel, l’écran de chargement du serveur de développement a été repensé sous la forme d’une animation interactive de particules WebGL2 représentant une chaîne de montagnes, avec des options de repli pour les systèmes ne disposant pas de WebGL2 ou les utilisateurs préférant un mouvement réduit.

Les pages d’erreur intégrées ont également été remaniées avec une palette de couleurs neutres et une typographie plus légère, ainsi qu’un bouton « Retour » nouvellement ajouté sur les pages 404. Bien que la prise en charge de Vue Vapor ait été ajoutée, l’équipe souligne que ces changements ne causent pas de rupture de compatibilité pour les utilisateurs actuels de Nuxt v4, même si la prise en charge héritée de Nuxt 2 et du package « bridge » a été abandonnée.

Pour les développeurs envisageant une mise à niveau, la nouvelle version préserve la rétrocompatibilité des projets actuels tout en apportant des améliorations fondamentales pour une flexibilité future. Ceux qui souhaitent migrer sont invités à consulter les notes de mise à jour complètes, notamment pour obtenir des détails sur les exigences de la CLI et les nouveaux modèles d’importation sur le serveur.


Voici quelques nouveautés dans cette version :

Nuxt CLI v4

Parallèlement à Nuxt 4.6, une nouvelle version majeure de la CLI Nuxt est également disponible dès aujourd’hui : @nuxt/cli v4. Elle est fournie en tant que dépendance de nuxt ; vous l’obtiendrez donc automatiquement lors de la mise à jour. La plupart des nouveautés concernent nuxt dev.

Un panneau interactif est désormais ancré au bas de votre terminal : il affiche les URL, la progression du démarrage et des raccourcis à une touche (r pour redémarrer, o pour ouvrir, l pour les journaux, n pour les requêtes, p pour les pages et les routes du serveur). Chaque requête se voit attribuer un identifiant, ce qui permet d’associer les journaux et les erreurs à la requête qui les a provoqués. Si vous préférez l’affichage classique, utilisez l’option --no-tui.

Le serveur de développement vous indique également pourquoi il s’est rechargé ou redémarré, quelles clés de nuxt.config ont été modifiées, où s’est passé le temps lors d’un démarrage lent, et combien de temps chaque module a mis à se configurer. Une sauvegarde qui ne change rien ne redémarre plus le serveur, et les redémarrages forcés continuent de servir sur le même port. Les erreurs passent par un canal unique au niveau de la CLI, affiché avec my-bad.

Un fichier de verrouillage situé dans le répertoire .nuxt/ permet à un deuxième nuxt dev (par exemple, celui lancé par un agent) de prendre le relais ou de s’aligner sur celui que vous avez démarré. Ce même fichier de verrouillage alimente les nouvelles commandes nuxt curl et nuxt task qui communiquent avec le serveur en cours d’exécution, tandis que nuxt docs "<query>" effectue une recherche dans la documentation correspondant à votre version installée de Nuxt. Vous pouvez également utiliser nuxt preview --takeover pour remplacer un serveur de prévisualisation en cours d’exécution.

Elle est également beaucoup plus légère et démarre beaucoup plus rapidement :


Bien qu’il s’agisse d’une version majeure, aucun de ces changements ne devrait poser de problème aux utilisateurs de Nuxt v4 : la CLI nécessite Node.js v22.21+, v24.11+ ou v26+, nuxt init a été supprimé au profit de npm create nuxt@latest, et Nuxt 2 ainsi que @nuxt/bridge ne sont plus pris en charge.

Un Nuxt indépendant du serveur

Le principal changement de cette version réside dans notre volonté de rendre Nuxt indépendant du serveur.

La liberté de choix est une valeur fondamentale du Web, qui rassemble toute l’équipe Nuxt. Vous pouvez utiliser pages/ (avec vue-router) ou non. Vous pouvez utiliser Vite, webpack ou Rspack pour regrouper votre code. Vous pouvez choisir parmi des dizaines de fournisseurs pour le déploiement, sélectionner n’importe quel fournisseur d’images ou de polices, et opter pour n’importe quel adaptateur de base de données. Dans tous les cas, le framework reste le même.

Il en allait autrement du côté serveur. Les composables #app importaient les types h3, le code serveur provenait de h3 et de nitropack, et chaque module en rapport avec le serveur était lié à la version majeure de ces paquets dont Nuxt dépendait à ce moment-là. Cela est devenu particulièrement évident lors de nos mises à niveau vers les nouvelles versions majeures de h3 et Nitro, qui apportaient des changements rompant la compatibilité et entraînant un effet en cascade sur l’ensemble de l’écosystème.

Cette version change la donne. En plus de définir explicitement notre API publique dans @nuxt/kit (qui ne fait désormais plus référence à des paquets externes), Nuxt spécifie désormais ses propres types pour l’événement request, les règles de routage et la fonction typée $fetch, et expose une surface d’importation, nuxt/server, pour les utilitaires serveur dont la plupart des applications ont besoin. C’est l’aboutissement d’un travail que nous avons entamé il y a près d’un an afin de permettre l’utilisation de n’importe quel générateur de serveur avec Nuxt, et pas seulement Nitro.

En coulisses, nuxt/server reste alimenté par Nitro par défaut. Nous annonçons également une deuxième implémentation expérimentale, @nuxt/vite-server, qui permet de créer des serveurs purement Vite à l’aide de l’API Vite Environment.

Nous voyons plusieurs avantages clés pour nuxt/server :

1. Cela facilite la mise à niveau vers Nuxt 5, qui passe à Nitro v3 et h3 v2. Le code serveur écrit pour nuxt/server sous la version 4.6 fonctionne tel quel, ce qui permet à un module de fournir un seul fichier pour les deux versions.

2. Cela dissocie Nuxt du cycle de publication de Nitro. Comme nous sommes propriétaires de l’API, nous pouvons nous adapter aux changements de compatibilité dans Nitro ou h3 sans avoir besoin d’une nouvelle version majeure, et nous pouvons publier des versions majeures de Nuxt sans attendre les publications en amont.

3. Cela rend le code de Nuxt plus facile à maintenir. Cela préserve la séparation des préoccupations entre notre API (nuxt/app et nuxt/server) et le bundler ainsi que le serveur avec lesquels vous construisez finalement votre application.

Il existe également d’autres avantages, allant d’une surface de types unique à la possibilité d’itérer plus rapidement sur les fonctionnalités.

Presque toutes les fonctionnalités de cette version sont déjà disponibles sur la branche Nuxt 5, et vous pouvez dès aujourd’hui tester la plupart des autres paramètres par défaut de Nuxt 5 en utilisant future.compatibilityVersion: 5.

Source : Annonce Nuxt 4.6

Et vous ?

Pensez-vous que cette version est crédible ou pertinente ?
Quel est votre avis sur le sujet ?

Voir aussi :

Vite, l'outil pour développeurs web, est à sa version 3. Il vise à fournir une expérience de développement plus rapide et plus légère pour les projets web modernes

Le framework open source de développement web full-stack Next.js 16.3 est disponible, apportant des gains de performances en réduisant la consommation de mémoire du serveur jusqu'à 90 %

La version 3.0 de SvelteKit, le framework d'application officiel de Svelte, est disponible, et se présente comme un framework backend à l'instar de Next.js, mais avec moins de complications
Vous avez lu gratuitement 97 articles depuis plus d'un an.
Soutenez le club developpez.com en souscrivant un abonnement pour que nous puissions continuer à vous proposer des publications.

Une erreur dans cette actualité ? Signalez-nous-la !