nodemon et pnpm : deux modules Node.js indispensables

Parmi bien d'autres
nodemon et pnpm : deux modules Node.js indispensables

Dans les semaines et mois à venir, nous allons vous parler de Node.js. Cet environnement d'exécution JavaScript côté serveur sera en effet à la base de certains projets que nous détaillerons dans de prochains articles. L'occasion pour nous d'évoquer certains outils annexes pouvant simplifier la vie des développeurs.

En 2009, Ryan Dahl décidait d'utiliser le moteur JavaScript de Chromium (v8) non plus pour exécuter du code côté client, mais côté serveur. D'en faire un environnement d'exécution pour pallier les manques des solutions de l'époque, à mi-chemin entre Java et Python. Une petite révolution, critiquée pour son aspect « JS partout », au succès indéniable.

Node.js est maintenu par l'OpenJS Foundation.

JavaScript, roi du Web

Il faut dire que, tout critiquable qu'il soit, JavaScript est un langage simple à apprendre (mais dur à réellement maitriser), qui a su évoluer dans le bon sens ces dernières années. Ainsi, dès 2010, le gestionnaire de paquet npm était créé pour accompagner la tendance. Désormais, les deux compères sont partout. 

La multiplication des chaînes YouTube dédiées et autres « formations » auto-proclamées montre à quel point le sujet intéresse. Il faut dire que Node.js et npm ont accompagné la transformation du web ces dix dernières années, que ce soit à travers l'évolution d'ECMAScript (le standard qui sert de base à JavaScript), la montée en puissance d'Angular, React ou Vue. Et de manière plus générale, les méthodes de développement web qui sont de plus en plus modulaires.

En 2020, créer un site débute souvent par un paquet npm. C'est notamment ce qui a poussé Microsoft à transformer .Net en .Net Core pour en faire une solution open source (licences MIT/Apache 2) et multiplateforme, installable aussi bien sur un serveur classique qu'un Raspberry Pi. Le projet est d'ailleurs géré désormais par une fondation dédiée où Microsoft n'est pas seul. Ce qui n'a pas empêché l'entreprise d'acheter npm en mars dernier à travers GitHub

Nous avons déjà eu l'occasion de vous présenter un projet exploitant Node.js par le passé, pour créer une application pouvant être packagée sous la forme d'un exécutable. Nous allons bientôt l'utiliser pour différents projets, nous voulions donc vous présenter certains des outils que nous utiliserons et qui peuvent vous faciliter la vie.

Commençons par nodemon et pnpm

Commençons avec une petite application

Pour suivre ce guide, il vous faudra bien entendu avoir installé Node.js sur votre système. Il est disponible pour Linux, macOS et Windows 10. Il vous faudra également un éditeur (IDE). Nous utiliserons Visual Studio Code, mais vous pouvez très bien lui préférer Atom, Notepad++, WebStorm ou même vim. Le fonctionnement sera le même.

Certaines des commandes tapées seront spécifiques à Windows 10, pensez à les adapter si vous êtes sous Linux/macOS.

Une fois tout en place, on créé un répertoire nodemonTest puis on l'ouvre dans l'IDE. Dans notre cas cela revient à taper les deux commandes suivantes, mais vous pouvez aussi le faire depuis l'Explorateur de fichiers : 

mkdir nodemonTest
cd nodemonTest
code .

Il faut ensuite initialiser le projet depuis le terminal de l'IDE (CTRL+MAJ+ù) :

npm init

Cela consiste à lui donner un nom, une description, des mots-clés, un numéro de version, des informations sur l'auteur, le dépôt GitHub, le point d'entrée, la licence, etc. Le tout enregistré dans un fichier package.json. Vous pouvez laisser les paramètres par défaut en pressant la touche Entrée à chaque question ou en utilisant cette commande :

npm init -y

N'hésitez pas à modifier ces paramètres comme bon vous semble, à la création ou plus tard dans le fichier package.json. Gardez simplement index.js comme point d'entrée. Il faut d'ailleurs créer ce fichier (CTRL+N) et l'enregistrer (CTRL+S). On peut alors commencer à y taper du code, par exemple pour l'habituel « Hello, World ! » :

console.log("Hello, World !")

Enregistrez le fichier puis tapez la commande suivante dans le terminal pour l'exécuter :

node index.js

Créer un serveur web en Node.js : rien de plus simple !

Imaginons maintenant que vous souhaitez non pas afficher ce texte dans la console, mais au sein d'une page web. Avec Node.js, rien de plus simple. Il suffit de modifier le code comme suit :

const http = require("http");
const port = 8080;

http.createServer((req, res) => {
res.end("Hello, World !");
}).listen(port)

Il faut alors enregistrer le fichier, puis taper à nouveau la commande ci-dessus dans le terminal. Cela créé un serveur web accessible via le port 8080 de la machine. Vous pouvez y accéder via le lien suivant : 

http://localhost:8080

Ajoutons un message dans la console pour indiquer que le serveur est lancé, avec un lien direct vers celui-ci pour y accéder d'un simple CTRL+clic dans le terminal. Il faut modifier le code ainsi : 

const http = require("http");
const port = 8080;

http.createServer((req, res) => {
res.end("Hello, World !");
}).listen(port, () => {
console.log (`Le serveur écoute à l'adresse suivante : http://localhost:${port}`)
})

Vous devriez commencer à comprendre le problème : à chaque modification il faut couper le serveur précédemment démarré (CTRL+C), enregistrer le fichier (CTRL+S) puis taper à nouveau la commande pour lancer la nouvelle version.

C'est là que nodemon peut venir à votre secours.

nodemon : un gain de temps pour les petits projets

Car si de nombreux framework/bibliothèques telles qu'Angular, React ou Vue proposent (nativement ou non) une mécanique de type Hot (Live) Reload, il n'est pas toujours nécessaire de se reposer sur de telles briques. Car elles impliquent l'installation d'un grand nombre de dépendances/modules et une taille minimale importante du projet. 

nodemon fait au plus simple et permet de lancer votre application tout en surveillant l'état des fichiers du dossier courant. Lorsqu'ils sont enregistrés, l'application est automatiquement redémarrée. Vous pouvez donc modifier votre code et simplement enregistrer le ou les fichiers du projet (CTRL+S ou CTRL+K S), il sera directement relancé.

Il s'agit d'un paquet npm, il vous suffit donc de l'installer comme suit :

npm install -g nodemon

Cela permet une installation dite globale, pour que nodemon soit exploitable depuis n'importe quel projet Node.js. Si vous préférez vous limiter à celui en cours, installez-le comme une dépendance de développement : 

npm install --save-dev nodemon

Une fois l'opération effectuée, il n'y a plus qu'à le lancer. Notez que vous pouvez demander l'ajout d'un délai avant la relance de l'application, ce qui permet par exemple d'avoir le temps d'enregistrer différents fichiers. Il est aussi possible d'effectuer une relance manuelle en tapant rs puis sur la touche Entrée dans le terminal.

nodemon index.js
nodemon --delay 10 index.js // 10 secondes d'attente
nodemon --delay 2500ms index.js // délai en millisecondes

La documentation complète de nodemon se trouve par ici.

Attention, sous Windows il peut y avoir un problème puisque les commandes ci-dessus pourront chercher à lancer le script nodemon.ps1 si vous utilisez un terminal PowerShell (ce qui est le cas par défaut sous Visual Studio Code). Mais sans modification, l'exécution de scripts tiers n'est pas autorisée. Vous avec alors trois possibilités :

  • Utiliser la commande nodemon.cmd plutôt que nodemon
  • Supprimer le fichier nodemon.ps1
  • Autoriser l'exécution de scripts tiers

Dans ce dernier cas, il faut lancer la commande suivante dans le terminal PowerShell :

Set-ExecutionPolicy -Scope "CurrentUser" -ExecutionPolicy "RemoteSigned"

Gagnez de l'espace disque avec pnpm

S'il s'est bien amélioré ces dernières années, le gestionnaire de paquets npm est critiqué pour de nombreux aspects. C'est d'ailleurs son manque de performances/rapidité qui avait poussé Facebook à créer yarn pour lui faire concurrence.

Mais il y a un autre point qui peut poser problème : si différents projets partagent de mêmes dépendances, vous allez stocker les paquets individuellement dans chacun d'entre eux. Autant dire que si vous avez régulièrement des applications qui partagent les même modules, nécessitant plusieurs dizaines/centaines de Mo, votre stockage va vite réduire.

C'est dans cette optique que pnpm a été créé. Il se veut ainsi plus rapide que npm ou yarn (dans sa version classique ou plug n' play) et plus efficace en termes d'utilisation de l'espace disque. Tous les modules sont installés dans un espace unique auquel vos projets Node.js accèdent, ils n'ont ainsi pas besoin d'être retéléchargés.

L'installation passe par la même méthode que nodemon :

npm install -g pnpm

Vous pouvez ensuite télécharger un paquet comme d'habitude, en remplaçant npm par pnpm. Par exemple pour Express :

pnpm install express

Si vous créez un second projet Node.js après cette commande et que vous la tapez à nouveau, Express sera mis en place mais sans qu'aucun nouveau fichier ne soit téléchargé. Ce qui sera clairement indiqué :

 pnpmpnpm

Dans la pratique, comme on peut le voir ci-dessus, un lien symbolique (junction) est créé dans le répertoire node_modules, menant aux modules placés dans le dossier .pnp_store de celui de l'utilisateur. 

Vous pouvez également ajouter un paquet au « store » local de pnpm, en voir la liste et les supprimer intégralement. En effet, contrairement à npm, lorsqu'un paquet est supprimé, il est en réalité gardé dans l'espace local, pouvant être réutilisé directement pour d'autres projets jusqu'à sa suppression définitive :

pnpm store add 
pnpm store status
pnpm store prune

Les commandes utilisables par npm le sont par pnpm. C'est également le cas pour npm qui permet d'exécuter un paquet. Il dispose également de son équivalent : pnpx.

S'il y a d'autres paquets Node.JS ou pour d'autres langages/runtimes qui vous aident régulièrement, n'hésitez pas à nous le faire savoir dans les commentaires. Ils pourront également faire l'objet de présentations à l'avenir.

Vous n'avez pas encore de notification

Page d'accueil
Options d'affichage
Abonné
Actualités
Abonné
Des thèmes sont disponibles :
Thème de baseThème de baseThème sombreThème sombreThème yinyang clairThème yinyang clairThème yinyang sombreThème yinyang sombreThème orange mécanique clairThème orange mécanique clairThème orange mécanique sombreThème orange mécanique sombreThème rose clairThème rose clairThème rose sombreThème rose sombre

Vous n'êtes pas encore INpactien ?

Inscrivez-vous !