NPM : Tout Savoir sur le Package Manager de Node JS

Avec npm (Node package manager), les développeurs JavaScript peuvent découvrir et installer des paquets (packages) de code Node.js dans leurs applications réseau ou leurs projets backend (côté serveur).

Un paquet node.js est un répertoire contenant un ou plusieurs modules ou bibliothèques JavaScript utilisés pour ajouter diverses fonctionnalités aux applications ou aux scripts. Sans paquets, un développeur ou un ingénieur logiciel doit écrire un nouveau code pour chaque fonctionnalité dont son projet a besoin.

Cet article explique le fonctionnement de npm et vous apprend à démarrer un projet avec lui et à installer des packages supplémentaires.

Télécharger l’aide-mémoire HTML ultime

Comment fonctionne le gestionnaire de paquets npm ?

Voici les trois rôles déterminants de npm :

• Répertoire – npm est un répertoire largement utilisé pour la publication de projets Node open-source, où les développeurs peuvent partager leur code source avec d’autres utilisateurs de npm. Angular, React et jQuery sont quelques-uns des paquets que vous pouvez télécharger à partir d’un répertoire npm.

• Interface de ligne de commande (CLI) – les développeurs exécutent la CLI de npm depuis un terminal ou un outil de ligne de commande pour installer ou désinstaller des paquets et gérer les versions ou les dépendances.

• Registre – tout paquet ou module que vous installez à l’aide de la CLI de npm est téléchargé depuis le registre public de npm, la base de données de logiciel JavaScript.

Qu’est-ce qu’un package.json ?

Chaque projet npm contient package.json, un fichier situé dans le répertoire racine. Il contient les métadonnées des projets ou des paquets npm, telles que les versions des paquets et les contributeurs.

Le fichier package.json simplifie l’identification, la gestion et l’installation d’un paquet. C’est pourquoi il est essentiel d’inclure package.json avant de publier des projets sur le registre npm.

Voici un exemple de ce que contient un fichier package.json :

{
  "name": "hostinger-npm",
  "version": "1.0.0",
  "description": "npm guide for beginner",
  "main": "beginner-npm.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "dependencies": {
    "express": "^4.17.1"
  },
  "repository": {
    "type": "git",
    "url": "https://github.com/hostinger/example.git"
  },
  "keywords": [
    "npm",
    "example",
    "basic"
  ],
  "author": "Hostinger International",
  "license": "MIT",
}

Pour vous aider à comprendre package.json, nous allons reprendre les lignes les plus importantes de l’exemple précédent :

"name": "hostinger-npm",

La ligne ci-dessus définit le nom du paquet. Il doit comporter moins de 214 caractères et être composé uniquement de lettres minuscules. Si vous souhaitez publier un outil sur le registre npm, son nom doit être différent de tous les paquets existants.

"version": "1.0.0",

La version spécifie la version actuelle de votre projet, et elle doit suivre les règles de versionnage sémantique.

"description": "npm guide for beginner",

Incluez les informations relatives au paquet dans la ligne de description pour aider les utilisateurs à découvrir votre projet sur le registre npm.

"main": "beginner-npm.js",

Le champ main spécifie le point d’entrée ou le fichier principal de votre projet. Si cette propriété est laissée vide, npm définira automatiquement sa valeur à index.js.

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
},

La propriété scripts contient des commandes qui exécutent des tâches pour votre projet. Un utilisateur de npm peut tirer parti de ce champ pour transmettre des arguments au CLI sans avoir à les retaper.

"dependencies": {
  "express": "^4.16.4"
},

Ce champ répertorie toutes les dépendances ou paquets utilisés dans le projet. Lorsque vous installez un outil à l’aide de la commande npm install, ce projet sera automatiquement inséré ici.

"repository": {
  "type": "git",
  "url": "https://github.com/hostinger/example.git"
},

La propriété repository ( répertoire ) contient l’URL du code source. Dans cet exemple, GitHub est l’emplacement du paquet, et Git est le système de contrôle de version.

"keywords": [
  "npm",
  "example",
  "basic"
],

Ce champ comprend un tableau de mots-clés liés à ce que fait le paquet, aidant les utilisateurs de npm à localiser les paquets via des recherches. Omettez cette propriété si vous ne souhaitez pas publier le projet sur le registre npm.

"author": "Hostinger International",

Utilisez la propriété author ( auteur ) pour indiquer le créateur du projet.

"license": "MIT",

Cette ligne définit la licence du projet npm, indiquant aux gens s’ils peuvent l’utiliser sans aucune restriction.

Pour plus d’informations sur les autres champs de package.json, consultez la documentation officielle de package.json.

Que sont les dépendances et les dépendances de développement?

les dépendances ( Dependencies ) et les dépendances de développement ( devDependencies ) sont des champs de package.json qui répertorient tous les paquets dont dépend un projet.

Le champ dependency comprend tous les paquets tiers nécessaires au fonctionnement de votre projet.

D’autre part, la propriété devDependency contient les paquets qui ne sont nécessaires que pendant le développement.

Les dépendances et les dépendances de développement sont installées via la commande npm install avec les flags --save et --save-dev.

Comment installer les modules npm et lancer des projets ?

Avant d’utiliser npm, assurez-vous que node.js est installé. Pour ce faire, ouvrez votre terminal et exécutez cette commande :

node -v

La fenêtre du terminal doit afficher la version de node.js installée sur votre système :

V14.17.5  

Faites de même pour npm en utilisant la commande suivante :

npm -v

Elle devrait également renvoyer un numéro de version comme ceci :

6.14.14

Si node.js n’a pas encore été installé, téléchargez-le depuis le site officiel.

Dans les sections suivantes, nous allons aborder certaines des commandes de base de npm.

Initialisation d’un projet avec npm

Pour démarrer un nouveau projet, exécutez la commande suivante à partir de la CLI de npm :

npm init

Cette commande créera le fichier package.json d’un projet dans le répertoire actuel.

Après avoir exécuté la commande npm init, le terminal affichera ces informations :

This utility will walk you through creating a package.json file.
It only covers the most common items, and tries to guess sensible defaults.

See `npm help init` for definitive documentation on these fields
and exactly what they do.

Use `npm install` afterwards to install a package and
save it as a dependency in the package.json file.

Press ^C at any time to quit.
package name: (test-npm)

Vous serez invité à saisir les informations relatives au projet dans l’ordre suivant :

• Nom du paquet
• Version initiale
• Description
• Point d’entrée
• Commande de test
• Répertoire Git
• Mots clés
• Auteur
• Licence

Répondez à chacune des invites npm init en saisissant des valeurs personnalisées avant d’appuyer sur Entrée. Vous pouvez également appuyer sur Entrée sans rien saisir pour conserver les valeurs par défaut ou celles entre parenthèses.

Voici un exemple de la façon dont nous remplissons les informations du paquet :

name: (test-npm)hostinger-npm
version: (1.0.0)1.0.0
description: npm guide for beginner
entry point: (index.js) beginner-npm.js
test command:
git repository:
keywords: npm, example, beginner
author: Hostinger International
license: (ISC) MIT

Après avoir saisi tous les détails du projet, npm init affichera l’aperçu du fichier package.json comme ceci :

{
  "name": "hostinger-npm",
  "version": "1.0.0",
  "description": "npm guide for beginner",
  "main": "beginner-npm.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [
    "npm",
    "example",
    "beginner"
  ],
  "author": "Hostinger International",
  "license": "MIT", 
}

Is this OK? (yes)

Tapez yes et appuyez sur Entrée pour enregistrer le fichier package.json. Vous pouvez le modifier ultérieurement en éditant le fichier ou en exécutant à nouveau la commande npm init.

Si vous souhaitez générer le fichier package.json avec des valeurs par défaut sans répondre aux invites de npm init, utilisez cette commande :

npm init --yes

npm créera un fichier package.json avec les valeurs par défaut, comme ceci :

{
  "name": "mymac-MacBok-Pro",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

Une fois que vous avez créé le fichier package.json, vous pouvez ajouter n’importe quel paquet node au projet.

Installation des modules npm dans votre projet

Il est essentiel d’apprendre comment installer un paquet lorsque l’on débute avec npm.

Pour ajouter un paquet à votre projet, exécutez l’une de ces commandes :

npm install <package-name>
// OR
npm i <package-name>

Par exemple, si vous souhaitez installer express, un framework web populaire qui simplifie les processus de développement web standard, utilisez la commande suivante :

npm install express

Cette commande installera le module express dans le dossier node_modules du répertoire racine du projet. Notez que node_modules n’apparaîtra qu’après l’installation du premier paquet.

Si le paquet est installé avec succès, le terminal affichera un message comme celui-ci :

Le package.json inclura également le module dans le champ dependencies :

{
  "name": "hostinger-npm",
  "version": "1.0.0",
  "description": "npm guide for beginner",
  "main": "beginner-npm.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [
    "npm",
    "example",
    "basic"
  ],
  "author": "Hostinger International",
  "license": "MIT",
  "dependencies": {
    "express": "^4.17.1"
  }
}

Installation d’un paquet en tant que dépendance de développement

Pour installer les outils qui ne seront utilisés que dans l’environnement de développement, utilisez la commande suivante :

npm install <package-name> --save-dev

Par exemple, vous pouvez utiliser nodemon pour recharger votre projet lorsqu’un fichier est modifié. Pour installer cet outil, tapez ceci dans le terminal :

npm install nodemon --save-dev 

Une fois que nodemon est installé, le terminal affichera ce message :

Le npm ajoutera également la section devDependencies avec les nouvelles données au fichier package.json comme ceci :

{
  "name": "hostinger-npm",
  "version": "1.0.0",
  "description": "npm guide for beginner",
  "main": "beginner-npm.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [
    "npm",
    "example",
    "basic"
  ],
  "author": "Hostinger International",
  "license": "MIT",
  "dependencies": {
    "express": "^4.17.1"
  }
  "devDependencies": {
    "nodemon": "^2.0.12"
  }
}

Installation globale d’un module sur votre système

Si vous souhaitez installer un paquet npm à utiliser à partir de la ligne de commande, entrez l’une des commandes suivantes :

npm install <package-name> --global
// OR
npm i <package-name> -g

Veillez à remplacer <package-name> par le nom du module.

Mise à jour de npm

Pour que votre code et vos outils restent sûrs et stables, mettez régulièrement à jour les paquets locaux et globaux téléchargés depuis le registre npm.

Avant de mettre à jour un paquet npm, vérifiez si l’un d’entre eux est périmé. Vous pouvez vérifier quels paquets npm de votre projet ou système ont des mises à jour disponibles en exécutant cette commande depuis le répertoire racine :

npm outdated

Pour vérifier si des paquets globaux sont périmés dans le système, exécutez la commande suivante :

npm outdated -g --depth=0

Après avoir obtenu la liste des modules périmés, vous pouvez soit mettre à jour tous les paquets, soit un seul d’entre eux.

Pour mettre à jour tous les paquets de votre projet, exécutez cette commande depuis la ligne de commande :

npm update

Pour mettre à jour un seul module, entrez ceci :

npm update <package-name>

N’oubliez pas de remplacer <package-name> par le nom du paquet que vous souhaitez mettre à jour.

Pour mettre à jour tous les paquets globaux du système, exécutez la commande suivante :

npm update -g

Afin de mettre à jour un seul paquet global, entrez la commande suivante, en remplaçant <package-name> par le nom du module :

npm update -g <package-name>

Pour mettre à jour votre gestionnaire de paquets Node lui-même, exécutez la commande suivante :

npm install npm@latest -g

Une fois que la dernière version de npm a été installée, la fenêtre du terminal affichera un message comme celui-ci :

Pour d’autres commandes CLI de npm, consultez la documentation des commandes de npm.

Conclusion

npm est un gestionnaire de paquets populaire qui permet aux développeurs JavaScript de partager et de déployer des paquets utiles rapidement et facilement.

Chaque projet npm contient un fichier appelé package.json dans son répertoire racine. Ce fichier comprend les métadonnées du projet, ce qui permet à quiconque de trouver le module sur le répertoire npm.

En plus de contenir les informations essentielles sur le projet, package.json stocke également la liste des dépendances du projet nécessaires à son fonctionnement.

De plus, les paquets que les développeurs ont installés pour les aider pendant le processus de développement seront inclus dans le package.json sous devDependencies.

Voici un aperçu des commandes npm pour vous aider à démarrer et à effectuer des tâches de base avec ce gestionnaire de paquets :

• Vérifier la version de npm :

npm -v

• Initialiser un projet :

npm init

• Installer des modules :

npm install <package-name>

• Installer un paquet en tant que dépendance de développement :

npm install <package-name> --save-dev

• Installer un module globalement sur le système :

npm install <package-name> --global

• Mettre à jour tous les paquets d’un projet :

npm update

• Mettre à jour la dernière version de npm :

npm install npm@latest -g

Nous espérons que cet article vous a aidé à comprendre ce qu’est npm et vous a fourni quelques indications pour commencer à travailler avec lui. N’hésitez pas à laisser un commentaire ci-dessous si vous avez des questions.

L'auteur

Fatima Z.

Fatima Zahra est une passionnée du marketing digital et de l'IT, elle fait partie de l'équipe du contenu de notre site web pour apporter à nos chers internautes une meilleure expérience client. Ses passes- temps impliquent le blogging et l'apprentissage des langues pour se connecter véritablement au cœur avec les autres.

Plus d'informations sur Fatima Z.