# Nodejs

La gestion de multiples versions de Nodejs avec ServBay est très simple. Nous allons illustrer cela en installant Nodejs 22.

# Installer Nodejs 22

Cliquez sur Services dans la barre latérale gauche, et vous pouvez voir plusieurs versions de Nodejs fournies par ServBay.

Installer Nodejs 22

Trouvez la ligne où se trouve Nodejs 22, cliquez sur le bouton de téléchargement vert à droite, et Nodejs 22 sera téléchargé et installé en quelques secondes seulement.

# Installer yarn et pnpm

Après l'installation de Nodejs 22, vérifions-le :

Version Nodejs 22

À partir de la sortie du terminal, nous pouvons voir que Nodejs 22 a été installé.

Alors, installons yarn et pnpm via corepack:

$ corepack enable yarn
$ yarn -v
1.22.22
$ corepack enable pnpm
$ pnpm -v
9.1.0
1
2
3
4
5
6

Nous pouvons voir que yarn et pnpm ont été installés.

# Exemple Vue 3

Après l'installation de Nodejs et yarn/pnpm, vous pouvez commencer le développement front-end. Ensuite, nous utiliserons Vue 3 comme un exemple.

# Structure de Vue 3

Tout d'abord, exécutons le scaffold Vue 3 pour générer un projet Vue 3.

Échafaudage Vue 3

# Installez des dépendances par yarn

Ensuite, entrez dans le répertoire du projet :

$ cd hello
1

Exécutez yarn pour installer les packages de dépendance :

Yarn Installer Deps

# Démarrer le serveur de développement

Ensuite, exécutez yarn dev pour démarrer le serveur de développement local :

$ yarn dev
1

Après le démarrage réussi du serveur, les informations suivantes seront affichées :

Info Dev Yarn

À ce moment-là, visitez http://localhost:5173 dans votre navigateur, et vous verrez la page d'accueil par défaut générée par Vue 3:

Page d'accueil par défaut de Vue 3

# Éditer le code source

Essayons de changer "You did it!" par "Bonjour, Monde!" et voyons ce qui se passe:

Code source Hello World Vue 3

Après avoir modifié le code, Vue 3 rafraîchira automatiquement la page, nous pourrons donc voir la page d'accueil du site Web modifiée :

Page Bonjour le Monde de Vue 3

Maintenant, vous êtes prêt à faire du développement front-end en utilisant nodejs.

Last Updated: 5/12/2024