{"id":8573,"date":"2021-06-02T08:11:34","date_gmt":"2021-06-02T08:11:34","guid":{"rendered":"\/tutoriels\/?p=8573"},"modified":"2025-03-03T23:39:59","modified_gmt":"2025-03-03T23:39:59","slug":"quest-ce-que-npm","status":"publish","type":"post","link":"\/fr\/tutoriels\/quest-ce-que-npm\/","title":{"rendered":"NPM : tout savoir sur le package manager de Node JS"},"content":{"rendered":"<p class=\"wp-block-paragraph\">Avec npm <strong>(Node package manager)<\/strong>, les d&eacute;veloppeurs JavaScript peuvent d&eacute;couvrir et installer des paquets <strong>(packages)<\/strong> de code Node.js dans leurs applications r&eacute;seau ou leurs projets backend <strong>(c&ocirc;t&eacute; serveur)<\/strong>.<\/p><p class=\"wp-block-paragraph\">Un paquet <strong>node.js<\/strong> est un r&eacute;pertoire contenant un ou plusieurs modules ou biblioth&egrave;ques JavaScript utilis&eacute;s pour ajouter diverses fonctionnalit&eacute;s aux applications ou aux scripts. Sans paquets, un d&eacute;veloppeur ou un ing&eacute;nieur logiciel doit &eacute;crire un nouveau code pour chaque fonctionnalit&eacute; dont son projet a besoin.<\/p><p class=\"wp-block-paragraph\">Cet article explique le fonctionnement de npm et vous apprend &agrave; d&eacute;marrer un projet avec lui et &agrave; installer des packages suppl&eacute;mentaires.<\/p><p>\n\n\n\n\n\n<div class=\"protip\"><div class=\"protip__heading\">\n                <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                    <path d=\"M1.49234 23.5024C1.23229 23.5024 0.972242 23.4024 0.782206 23.2123C0.562165 22.9923 0.452144 22.6822 0.502153 22.3722C0.562165 21.9221 1.14227 17.9113 3.00262 16.351C3.63274 15.8209 4.43289 15.5509 5.26305 15.5609C6.09321 15.5909 6.87335 15.9109 7.47347 16.4911C8.6937 17.6913 8.76371 19.6717 7.6435 20.9919C6.0832 22.8523 2.08245 23.4324 1.63237 23.4924C1.59236 23.4924 1.54235 23.4924 1.50234 23.4924L1.49234 23.5024ZM5.16303 17.5613C4.84297 17.5613 4.53291 17.6713 4.29287 17.8813C3.60274 18.4614 3.07264 19.9317 2.75258 21.242C4.06282 20.9219 5.5331 20.3918 6.11321 19.7017C6.55329 19.1716 6.54329 18.3814 6.0832 17.9213C5.85316 17.7013 5.5431 17.5713 5.20304 17.5613C5.19304 17.5613 5.17303 17.5613 5.16303 17.5613ZM11.7243 21.8821C11.4942 21.8821 11.2642 21.8021 11.0841 21.652C10.8541 21.462 10.7241 21.1819 10.7241 20.8819V15.9109L8.08358 13.2705H3.11264C2.81259 13.2705 2.53254 13.1404 2.3425 12.9104C2.15246 12.6803 2.07245 12.3803 2.12246 12.0902C2.19247 11.7102 2.84259 8.36953 4.70294 7.12929C6.33325 6.04909 8.96375 6.49918 10.244 6.80923C11.5442 4.96889 13.2546 3.4286 15.2349 2.33839C17.4553 1.11816 19.9858 0.518051 22.4963 0.498047C23.0464 0.498047 23.4865 0.948132 23.4865 1.49824C23.4865 5.0389 22.3763 9.97983 17.1753 13.7605C17.4853 15.0408 17.9354 17.6613 16.8552 19.2816C15.615 21.1419 12.2744 21.7921 11.8943 21.8621C11.8343 21.8721 11.7743 21.8821 11.7143 21.8821H11.7243ZM12.7245 16.181V19.6016C13.7146 19.2916 14.7948 18.7915 15.2049 18.1814C15.675 17.4812 15.605 16.091 15.385 14.9008C14.5248 15.3808 13.6346 15.8109 12.7245 16.181ZM9.66388 12.0302L11.9643 14.3307C13.1845 13.8306 14.3648 13.2204 15.485 12.5103C19.9358 9.51974 21.2361 5.60901 21.4561 2.53843C19.6157 2.67846 17.8254 3.20856 16.2051 4.09872C14.2847 5.14892 12.6544 6.68921 11.4942 8.54956C10.7841 9.65977 10.174 10.82 9.66388 12.0302ZM4.39289 11.2701H7.81353C8.1936 10.3599 8.63368 9.46974 9.11377 8.60957C7.92355 8.38953 6.51329 8.31952 5.81315 8.78961C5.19304 9.19968 4.70294 10.3099 4.39289 11.2701Z\" fill=\"#673DE6\"\/>\n                <\/svg>\n                <p class=\"protip__title\">\n                   Qu'est-ce que npm ?\n                <\/p>\n            <\/div>\n            <p class=\"protip__content\">Le gestionnaire de paquets Node (npm) est l&rsquo;un des plus grands registres de logiciels au monde. Il est fourni avec node.js, un environnement de serveur open-source.<\/p><\/div>\n\n\n\n<\/p><h2 class=\"wp-block-heading\" id=\"h-comment-fonctionne-le-gestionnaire-de-paquets-npm\">Comment fonctionne le gestionnaire de paquets npm ?<\/h2><p class=\"wp-block-paragraph\">Voici les trois r&ocirc;les d&eacute;terminants de npm :<\/p><ul class=\"wp-block-list\">\n<li><strong>R&eacute;pertoire&nbsp;<\/strong>&ndash; npm est un r&eacute;pertoire largement utilis&eacute; pour la publication de projets Node open-source, o&ugrave; les d&eacute;veloppeurs peuvent partager leur code source avec d&rsquo;autres utilisateurs de npm. <strong>Angular<\/strong>, <strong>React<\/strong> et <strong>jQuery<\/strong> sont quelques-uns des paquets que vous pouvez t&eacute;l&eacute;charger &agrave; partir d&rsquo;un r&eacute;pertoire npm.<\/li>\n<\/ul><ul class=\"wp-block-list\">\n<li><strong>Interface de ligne de commande (CLI) <\/strong>&ndash; les d&eacute;veloppeurs ex&eacute;cutent la CLI de npm depuis un terminal ou un outil de ligne de commande pour installer ou d&eacute;sinstaller des paquets et g&eacute;rer les versions ou les d&eacute;pendances.<\/li>\n<\/ul><ul class=\"wp-block-list\">\n<li><strong>Registre<\/strong> &ndash; tout paquet ou module que vous installez &agrave; l&rsquo;aide de la CLI de npm est t&eacute;l&eacute;charg&eacute; depuis le <a href=\"https:\/\/registry.npmjs.org\/\" target=\"_blank\" rel=\"noopener\">registre public de npm<\/a>, la base de donn&eacute;es de logiciel JavaScript.<\/li>\n<\/ul><h2 class=\"wp-block-heading\" id=\"h-qu-est-ce-qu-un-package-json\">Qu&rsquo;est-ce qu&rsquo;un package.json ?<\/h2><p class=\"wp-block-paragraph\">Chaque projet npm contient<strong> package.json<\/strong>, un fichier situ&eacute; dans le r&eacute;pertoire racine. Il contient les m&eacute;tadonn&eacute;es des projets ou des paquets npm, telles que les versions des paquets et les contributeurs.<\/p><p class=\"wp-block-paragraph\">Le fichier <strong>package.json<\/strong> simplifie l&rsquo;identification, la gestion et l&rsquo;installation d&rsquo;un paquet. C&rsquo;est pourquoi il est essentiel d&rsquo;inclure <strong>package.json<\/strong> avant de publier des projets sur le registre npm.<\/p><p class=\"wp-block-paragraph\">Voici un exemple de ce que contient un fichier <strong>package.json<\/strong> :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">{\n  \"name\": \"hostinger-npm\",\n  \"version\": \"1.0.0\",\n  \"description\": \"npm guide for beginner\",\n  \"main\": \"beginner-npm.js\",\n  \"scripts\": {\n    \"test\": \"echo \\\"Error: no test specified\\\" &amp;&amp; exit 1\"\n  },\n  \"dependencies\": {\n    \"express\": \"^4.17.1\"\n  },\n  \"repository\": {\n    \"type\": \"git\",\n    \"url\": \"https:\/\/github.com\/hostinger\/example.git\"\n  },\n  \"keywords\": [\n    \"npm\",\n    \"example\",\n    \"basic\"\n  ],\n  \"author\": \"Hostinger International\",\n  \"license\": \"MIT\",\n}<\/pre><p class=\"wp-block-paragraph\">Pour vous aider &agrave; comprendre <strong>package.json<\/strong>, nous allons reprendre les lignes les plus importantes de l&rsquo;exemple pr&eacute;c&eacute;dent :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">\"name\": \"hostinger-npm\",<\/pre><p class=\"wp-block-paragraph\">La ligne ci-dessus d&eacute;finit le <strong>nom du paquet<\/strong>. Il doit comporter moins de 214 caract&egrave;res et &ecirc;tre compos&eacute; uniquement de lettres minuscules. Si vous souhaitez publier un outil sur le registre npm, son nom doit &ecirc;tre diff&eacute;rent de tous les paquets existants.<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">\"version\": \"1.0.0\",<\/pre><p class=\"wp-block-paragraph\">La <strong>version<\/strong> sp&eacute;cifie la version actuelle de votre projet, et elle doit suivre les <a href=\"https:\/\/docs.npmjs.com\/about-semantic-versioning\" target=\"_blank\" rel=\"noreferrer noopener\">r&egrave;gles de versionnage s&eacute;mantique<\/a>.<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">\"description\": \"npm guide for beginner\",<\/pre><p class=\"wp-block-paragraph\">Incluez les informations relatives au paquet dans la ligne de <strong>description<\/strong> pour aider les utilisateurs &agrave; d&eacute;couvrir votre projet sur le registre npm.<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">\"main\": \"beginner-npm.js\",<\/pre><p class=\"wp-block-paragraph\">Le champ <strong>main<\/strong> sp&eacute;cifie le point d&rsquo;entr&eacute;e ou le fichier principal de votre projet. Si cette propri&eacute;t&eacute; est laiss&eacute;e vide, npm d&eacute;finira automatiquement sa valeur &agrave; <strong>index.js<\/strong>.<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">\"scripts\": {\n    \"test\": \"echo \\\"Error: no test specified\\\" &amp;&amp; exit 1\"\n},<\/pre><p class=\"wp-block-paragraph\">La propri&eacute;t&eacute; <strong>scripts<\/strong> contient des commandes qui ex&eacute;cutent des t&acirc;ches pour votre projet. Un utilisateur de npm peut tirer parti de ce champ pour transmettre des arguments au CLI sans avoir &agrave; les retaper.<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">\"dependencies\": {\n  \"express\": \"^4.16.4\"\n},<\/pre><p class=\"wp-block-paragraph\">Ce champ r&eacute;pertorie toutes les <strong>d&eacute;pendances<\/strong> ou paquets utilis&eacute;s dans le projet. Lorsque vous installez un outil &agrave; l&rsquo;aide de la commande <code data-enlighter-language=\"generic\" class=\"EnlighterJSRAW\">npm install<\/code>, ce projet sera automatiquement ins&eacute;r&eacute; ici.<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">\"repository\": {\n  \"type\": \"git\",\n  \"url\": \"https:\/\/github.com\/hostinger\/example.git\"\n},<\/pre><p class=\"wp-block-paragraph\">La propri&eacute;t&eacute; <strong>repository<\/strong> ( r&eacute;pertoire ) contient l&rsquo;URL du code source. Dans cet exemple, <a href=\"https:\/\/www.hostinger.com\/fr\/tutoriels\/github-cest-quoi-et-comment-lutiliser\/\" target=\"_blank\" rel=\"noreferrer noopener\">GitHub<\/a> est l&rsquo;emplacement du paquet, et <a href=\"https:\/\/www.hostinger.com\/fr\/tutoriels\/tuto-git\/\" target=\"_blank\" rel=\"noreferrer noopener\">Git<\/a> est le syst&egrave;me de contr&ocirc;le de version.<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">\"keywords\": [\n  \"npm\",\n  \"example\",\n  \"basic\"\n],<\/pre><p class=\"wp-block-paragraph\">Ce champ comprend un tableau de <strong>mots-cl&eacute;s<\/strong> li&eacute;s &agrave; ce que fait le paquet, aidant les utilisateurs de npm &agrave; localiser les paquets via des recherches. Omettez cette propri&eacute;t&eacute; si vous ne souhaitez pas publier le projet sur le registre npm.<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">\"author\": \"Hostinger International\",<\/pre><p class=\"wp-block-paragraph\">Utilisez la propri&eacute;t&eacute; <strong>author<\/strong> ( auteur ) pour indiquer le cr&eacute;ateur du projet.<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">\"license\": \"MIT\",<\/pre><p class=\"wp-block-paragraph\">Cette ligne d&eacute;finit la <strong>licence<\/strong> du projet npm, indiquant aux gens s&rsquo;ils peuvent l&rsquo;utiliser sans aucune restriction.<\/p><p class=\"wp-block-paragraph\">Pour plus d&rsquo;informations sur les autres champs de <strong>package.json<\/strong>, consultez la <a href=\"https:\/\/docs.npmjs.com\/cli\/v8\/configuring-npm\/package-json\" target=\"_blank\" rel=\"noreferrer noopener\">documentation officielle de package.json<\/a>.<\/p><h2 class=\"wp-block-heading\" id=\"h-que-sont-les-dependances-et-les-dependances-de-developpement\">Que sont les d&eacute;pendances et les d&eacute;pendances de d&eacute;veloppement?<\/h2><p class=\"wp-block-paragraph\">les d&eacute;pendances ( Dependencies ) et les d&eacute;pendances de d&eacute;veloppement ( devDependencies ) sont des champs de <strong>package.json<\/strong> qui r&eacute;pertorient tous les paquets dont d&eacute;pend un projet.<\/p><p class=\"wp-block-paragraph\">Le champ dependency comprend tous les paquets tiers n&eacute;cessaires au fonctionnement de votre projet.<\/p><p class=\"wp-block-paragraph\">D&rsquo;autre part, la propri&eacute;t&eacute; devDependency contient les paquets qui ne sont n&eacute;cessaires que pendant le d&eacute;veloppement.<\/p><p class=\"wp-block-paragraph\">Les d&eacute;pendances et les d&eacute;pendances de d&eacute;veloppement sont install&eacute;es via la commande <code data-enlighter-language=\"generic\" class=\"EnlighterJSRAW\">npm install<\/code> avec les flags <code data-enlighter-language=\"generic\" class=\"EnlighterJSRAW\">--save<\/code> et <code data-enlighter-language=\"generic\" class=\"EnlighterJSRAW\">--save-dev<\/code>.<\/p><h2 class=\"wp-block-heading\" id=\"h-comment-installer-les-modules-npm-et-lancer-des-projets\">Comment installer les modules npm et lancer des projets ?<\/h2><p class=\"wp-block-paragraph\">Avant d&rsquo;utiliser npm, assurez-vous que <strong>node.js<\/strong> est install&eacute;. Pour ce faire, ouvrez votre terminal et ex&eacute;cutez cette commande :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">node -v<\/pre><p class=\"wp-block-paragraph\">La fen&ecirc;tre du terminal doit afficher la version de <strong>node.js<\/strong> install&eacute;e sur votre syst&egrave;me :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">V14.17.5  <\/pre><p class=\"wp-block-paragraph\">Faites de m&ecirc;me pour npm en utilisant la commande suivante :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm -v<\/pre><p class=\"wp-block-paragraph\">Elle devrait &eacute;galement renvoyer un num&eacute;ro de version comme ceci :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">6.14.14<\/pre><p class=\"wp-block-paragraph\">Si <strong>node.js<\/strong> n&rsquo;a pas encore &eacute;t&eacute; install&eacute;, t&eacute;l&eacute;chargez-le depuis le <a href=\"https:\/\/nodejs.org\/fr\/download\/\" target=\"_blank\" rel=\"noreferrer noopener\">site officiel<\/a>.<\/p><div class=\"wp-block-image is-style-default\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"483\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/08\/Site-officiel-node.js_.jpg\/w=1024,h=1024,fit=scale-down\" alt=\"Site officiel de node.js\" class=\"wp-image-12555\" title=\"Site-officiel-de-node.js\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/08\/Site-officiel-node.js_.jpg\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/08\/Site-officiel-node.js_.jpg\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/08\/Site-officiel-node.js_.jpg\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/08\/Site-officiel-node.js_.jpg\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Dans les sections suivantes, nous allons aborder certaines des commandes de base de npm.<\/p><p>\n\n\n        <div class=\"protip\">\n            <div class=\"protip__heading\">\n                <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                    <path d=\"M1.49234 23.5024C1.23229 23.5024 0.972242 23.4024 0.782206 23.2123C0.562165 22.9923 0.452144 22.6822 0.502153 22.3722C0.562165 21.9221 1.14227 17.9113 3.00262 16.351C3.63274 15.8209 4.43289 15.5509 5.26305 15.5609C6.09321 15.5909 6.87335 15.9109 7.47347 16.4911C8.6937 17.6913 8.76371 19.6717 7.6435 20.9919C6.0832 22.8523 2.08245 23.4324 1.63237 23.4924C1.59236 23.4924 1.54235 23.4924 1.50234 23.4924L1.49234 23.5024ZM5.16303 17.5613C4.84297 17.5613 4.53291 17.6713 4.29287 17.8813C3.60274 18.4614 3.07264 19.9317 2.75258 21.242C4.06282 20.9219 5.5331 20.3918 6.11321 19.7017C6.55329 19.1716 6.54329 18.3814 6.0832 17.9213C5.85316 17.7013 5.5431 17.5713 5.20304 17.5613C5.19304 17.5613 5.17303 17.5613 5.16303 17.5613ZM11.7243 21.8821C11.4942 21.8821 11.2642 21.8021 11.0841 21.652C10.8541 21.462 10.7241 21.1819 10.7241 20.8819V15.9109L8.08358 13.2705H3.11264C2.81259 13.2705 2.53254 13.1404 2.3425 12.9104C2.15246 12.6803 2.07245 12.3803 2.12246 12.0902C2.19247 11.7102 2.84259 8.36953 4.70294 7.12929C6.33325 6.04909 8.96375 6.49918 10.244 6.80923C11.5442 4.96889 13.2546 3.4286 15.2349 2.33839C17.4553 1.11816 19.9858 0.518051 22.4963 0.498047C23.0464 0.498047 23.4865 0.948132 23.4865 1.49824C23.4865 5.0389 22.3763 9.97983 17.1753 13.7605C17.4853 15.0408 17.9354 17.6613 16.8552 19.2816C15.615 21.1419 12.2744 21.7921 11.8943 21.8621C11.8343 21.8721 11.7743 21.8821 11.7143 21.8821H11.7243ZM12.7245 16.181V19.6016C13.7146 19.2916 14.7948 18.7915 15.2049 18.1814C15.675 17.4812 15.605 16.091 15.385 14.9008C14.5248 15.3808 13.6346 15.8109 12.7245 16.181ZM9.66388 12.0302L11.9643 14.3307C13.1845 13.8306 14.3648 13.2204 15.485 12.5103C19.9358 9.51974 21.2361 5.60901 21.4561 2.53843C19.6157 2.67846 17.8254 3.20856 16.2051 4.09872C14.2847 5.14892 12.6544 6.68921 11.4942 8.54956C10.7841 9.65977 10.174 10.82 9.66388 12.0302ZM4.39289 11.2701H7.81353C8.1936 10.3599 8.63368 9.46974 9.11377 8.60957C7.92355 8.38953 6.51329 8.31952 5.81315 8.78961C5.19304 9.19968 4.70294 10.3099 4.39289 11.2701Z\" fill=\"#673DE6\"\/>\n                <\/svg>\n                <p class=\"protip__title\">\n                    Conseil de pro                <\/p>\n            <\/div>\n            <p class=\"protip__content\">Si vous utilisez le VPS d&rsquo;Hostinger, vous pouvez choisir un <a href=\"https:\/\/support.hostinger.com\/fr\/articles\/1583571-quels-sont-les-systemes-d-exploitation-disponibles-pour-les-vps\" target=\"_blank\" rel=\"noopener\">mod&egrave;le de syst&egrave;me d'exploitation<\/a> avec <a href=\"https:\/\/www.hostinger.com\/fr\/vps\/hebergement-nodejs\">Node.js<\/a> d&eacute;j&agrave; pr&eacute;install&eacute;.<\/p>\n                    <\/div>\n        \n\n\n\n<\/p><h3 class=\"wp-block-heading\" id=\"h-initialisation-d-un-projet-avec-npm\"><strong>Initialisation d&rsquo;un projet avec npm<\/strong><\/h3><p class=\"wp-block-paragraph\">Pour d&eacute;marrer un nouveau projet, ex&eacute;cutez la commande suivante &agrave; partir de la CLI de npm :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm init<\/pre><p class=\"wp-block-paragraph\">Cette commande cr&eacute;era le fichier <strong>package.json<\/strong> d&rsquo;un projet dans le r&eacute;pertoire actuel.<\/p><p class=\"wp-block-paragraph\">Apr&egrave;s avoir ex&eacute;cut&eacute; la commande <code data-enlighter-language=\"generic\" class=\"EnlighterJSRAW\">npm init<\/code>, le terminal affichera ces informations :<\/p><div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:100%\">\n<div class=\"wp-block-group\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">This utility will walk you through creating a package.json file.\nIt only covers the most common items, and tries to guess sensible defaults.\n\nSee `npm help init` for definitive documentation on these fields\nand exactly what they do.\n\nUse `npm install` afterwards to install a package and\nsave it as a dependency in the package.json file.\n\nPress ^C at any time to quit.\npackage name: (test-npm)<\/pre>\n<\/div><\/div>\n<\/div>\n<\/div><p class=\"wp-block-paragraph\">Vous serez invit&eacute; &agrave; saisir les informations relatives au projet dans l&rsquo;ordre suivant :<\/p><ul class=\"wp-block-list\">\n<li>Nom du paquet<\/li>\n\n\n\n<li>Version initiale<\/li>\n\n\n\n<li>Description<\/li>\n\n\n\n<li>Point d&rsquo;entr&eacute;e<\/li>\n\n\n\n<li>Commande de test<\/li>\n\n\n\n<li>R&eacute;pertoire Git<\/li>\n\n\n\n<li>Mots cl&eacute;s<\/li>\n\n\n\n<li>Auteur<\/li>\n\n\n\n<li>Licence<\/li>\n<\/ul><p class=\"wp-block-paragraph\">R&eacute;pondez &agrave; chacune des invites <code data-enlighter-language=\"generic\" class=\"EnlighterJSRAW\">npm init<\/code> en saisissant des valeurs personnalis&eacute;es avant d&rsquo;appuyer sur <strong>Entr&eacute;e<\/strong>. Vous pouvez &eacute;galement appuyer sur <strong>Entr&eacute;e<\/strong> sans rien saisir pour conserver les valeurs par d&eacute;faut ou celles entre parenth&egrave;ses.<\/p><p class=\"wp-block-paragraph\">Voici un exemple de la fa&ccedil;on dont nous remplissons les informations du paquet :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">name: (test-npm)hostinger-npm\nversion: (1.0.0)1.0.0\ndescription: npm guide for beginner\nentry point: (index.js) beginner-npm.js\ntest command:\ngit repository:\nkeywords: npm, example, beginner\nauthor: Hostinger International\nlicense: (ISC) MIT<\/pre><p class=\"wp-block-paragraph\">Apr&egrave;s avoir saisi tous les d&eacute;tails du projet, <code data-enlighter-language=\"generic\" class=\"EnlighterJSRAW\">npm init<\/code> affichera l&rsquo;aper&ccedil;u du fichier <strong>package.json<\/strong> comme ceci :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">{\n  \"name\": \"hostinger-npm\",\n  \"version\": \"1.0.0\",\n  \"description\": \"npm guide for beginner\",\n  \"main\": \"beginner-npm.js\",\n  \"scripts\": {\n    \"test\": \"echo \\\"Error: no test specified\\\" &amp;&amp; exit 1\"\n  },\n  \"keywords\": [\n    \"npm\",\n    \"example\",\n    \"beginner\"\n  ],\n  \"author\": \"Hostinger International\",\n  \"license\": \"MIT\", \n}\n\nIs this OK? (yes)<\/pre><p class=\"wp-block-paragraph\">Tapez <strong>yes<\/strong> et appuyez sur <strong>Entr&eacute;e<\/strong> pour enregistrer le fichier <strong>package.json<\/strong>. Vous pouvez le modifier ult&eacute;rieurement en &eacute;ditant le fichier ou en ex&eacute;cutant &agrave; nouveau la commande <code data-enlighter-language=\"generic\" class=\"EnlighterJSRAW\">npm init<\/code>.<\/p><p class=\"wp-block-paragraph\">Si vous souhaitez g&eacute;n&eacute;rer le fichier <strong>package.json<\/strong> avec des valeurs par d&eacute;faut sans r&eacute;pondre aux invites de <code data-enlighter-language=\"generic\" class=\"EnlighterJSRAW\">npm init<\/code>, utilisez cette commande :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm init --yes<\/pre><p class=\"wp-block-paragraph\">npm cr&eacute;era un fichier <strong>package.json<\/strong> avec les valeurs par d&eacute;faut, comme ceci :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">{\n  \"name\": \"mymac-MacBok-Pro\",\n  \"version\": \"1.0.0\",\n  \"description\": \"\",\n  \"main\": \"index.js\",\n  \"scripts\": {\n    \"test\": \"echo \\\"Error: no test specified\\\" &amp;&amp; exit 1\"\n  },\n  \"keywords\": [],\n  \"author\": \"\",\n  \"license\": \"ISC\"\n}<\/pre><p class=\"wp-block-paragraph\">Une fois que vous avez cr&eacute;&eacute; le fichier <strong>package.json<\/strong>, vous pouvez ajouter n&rsquo;importe quel paquet node au projet.<\/p><h3 class=\"wp-block-heading\" id=\"h-installation-des-modules-npm-dans-votre-projet\">Installation des modules npm dans votre projet<\/h3><p class=\"wp-block-paragraph\">Il est essentiel d&rsquo;apprendre comment installer un paquet lorsque l&rsquo;on d&eacute;bute avec npm.<\/p><p class=\"wp-block-paragraph\">Pour ajouter un paquet &agrave; votre projet, ex&eacute;cutez l&rsquo;une de ces commandes :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm install &lt;package-name&gt;\n\/\/ OR\nnpm i &lt;package-name&gt;<\/pre><p>\n\n\n        <div class=\"protip\">\n            <div class=\"protip__heading\">\n                <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                    <path d=\"M1.49234 23.5024C1.23229 23.5024 0.972242 23.4024 0.782206 23.2123C0.562165 22.9923 0.452144 22.6822 0.502153 22.3722C0.562165 21.9221 1.14227 17.9113 3.00262 16.351C3.63274 15.8209 4.43289 15.5509 5.26305 15.5609C6.09321 15.5909 6.87335 15.9109 7.47347 16.4911C8.6937 17.6913 8.76371 19.6717 7.6435 20.9919C6.0832 22.8523 2.08245 23.4324 1.63237 23.4924C1.59236 23.4924 1.54235 23.4924 1.50234 23.4924L1.49234 23.5024ZM5.16303 17.5613C4.84297 17.5613 4.53291 17.6713 4.29287 17.8813C3.60274 18.4614 3.07264 19.9317 2.75258 21.242C4.06282 20.9219 5.5331 20.3918 6.11321 19.7017C6.55329 19.1716 6.54329 18.3814 6.0832 17.9213C5.85316 17.7013 5.5431 17.5713 5.20304 17.5613C5.19304 17.5613 5.17303 17.5613 5.16303 17.5613ZM11.7243 21.8821C11.4942 21.8821 11.2642 21.8021 11.0841 21.652C10.8541 21.462 10.7241 21.1819 10.7241 20.8819V15.9109L8.08358 13.2705H3.11264C2.81259 13.2705 2.53254 13.1404 2.3425 12.9104C2.15246 12.6803 2.07245 12.3803 2.12246 12.0902C2.19247 11.7102 2.84259 8.36953 4.70294 7.12929C6.33325 6.04909 8.96375 6.49918 10.244 6.80923C11.5442 4.96889 13.2546 3.4286 15.2349 2.33839C17.4553 1.11816 19.9858 0.518051 22.4963 0.498047C23.0464 0.498047 23.4865 0.948132 23.4865 1.49824C23.4865 5.0389 22.3763 9.97983 17.1753 13.7605C17.4853 15.0408 17.9354 17.6613 16.8552 19.2816C15.615 21.1419 12.2744 21.7921 11.8943 21.8621C11.8343 21.8721 11.7743 21.8821 11.7143 21.8821H11.7243ZM12.7245 16.181V19.6016C13.7146 19.2916 14.7948 18.7915 15.2049 18.1814C15.675 17.4812 15.605 16.091 15.385 14.9008C14.5248 15.3808 13.6346 15.8109 12.7245 16.181ZM9.66388 12.0302L11.9643 14.3307C13.1845 13.8306 14.3648 13.2204 15.485 12.5103C19.9358 9.51974 21.2361 5.60901 21.4561 2.53843C19.6157 2.67846 17.8254 3.20856 16.2051 4.09872C14.2847 5.14892 12.6544 6.68921 11.4942 8.54956C10.7841 9.65977 10.174 10.82 9.66388 12.0302ZM4.39289 11.2701H7.81353C8.1936 10.3599 8.63368 9.46974 9.11377 8.60957C7.92355 8.38953 6.51329 8.31952 5.81315 8.78961C5.19304 9.19968 4.70294 10.3099 4.39289 11.2701Z\" fill=\"#673DE6\"\/>\n                <\/svg>\n                <p class=\"protip__title\">\n                    Conseil de Pro                <\/p>\n            <\/div>\n            <p class=\"protip__content\"> Dans les commandes ci-dessus, remplacez par le nom du module que vous souhaitez installer. <\/p>\n                    <\/div>\n        \n\n\n\n<\/p><p class=\"wp-block-paragraph\">Par exemple, si vous souhaitez installer <strong><a href=\"https:\/\/www.npmjs.com\/package\/express\" target=\"_blank\" rel=\"noreferrer noopener\">express<\/a><\/strong>, un framework web populaire qui simplifie les processus de d&eacute;veloppement web standard, utilisez la commande suivante :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm install express<\/pre><p class=\"wp-block-paragraph\">Cette commande installera le module express dans le dossier <strong>node_modules<\/strong> du r&eacute;pertoire racine du projet. Notez que <strong>node_modules<\/strong> n&rsquo;appara&icirc;tra qu&rsquo;apr&egrave;s l&rsquo;installation du premier paquet.<\/p><p class=\"wp-block-paragraph\">Si le paquet est install&eacute; avec succ&egrave;s, le terminal affichera un message comme celui-ci :<\/p><figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"870\" height=\"117\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/08\/express-module.jpg\/public\" alt=\"Message du terminal : express a &eacute;t&eacute; install&eacute; avec succ&egrave;s.\" class=\"wp-image-12558\" title=\"message-terminal-d-installation-module-express\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/08\/express-module.jpg\/w=870,fit=scale-down 870w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/08\/express-module.jpg\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/08\/express-module.jpg\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/08\/express-module.jpg\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 870px) 100vw, 870px\" \/><\/figure><p class=\"wp-block-paragraph\">Le <strong>package.json<\/strong> inclura &eacute;galement le module dans le champ <code data-enlighter-language=\"generic\" class=\"EnlighterJSRAW\">dependencies<\/code> :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">{\n  \"name\": \"hostinger-npm\",\n  \"version\": \"1.0.0\",\n  \"description\": \"npm guide for beginner\",\n  \"main\": \"beginner-npm.js\",\n  \"scripts\": {\n    \"test\": \"echo \\\"Error: no test specified\\\" &amp;&amp; exit 1\"\n  },\n  \"keywords\": [\n    \"npm\",\n    \"example\",\n    \"basic\"\n  ],\n  \"author\": \"Hostinger International\",\n  \"license\": \"MIT\",\n  \"dependencies\": {\n    \"express\": \"^4.17.1\"\n  }\n}<\/pre><h3 class=\"wp-block-heading\" id=\"h-installation-d-un-paquet-en-tant-que-dependance-de-developpement\">Installation d&rsquo;un paquet en tant que d&eacute;pendance de d&eacute;veloppement<\/h3><p class=\"wp-block-paragraph\">Pour installer les outils qui ne seront utilis&eacute;s que dans l&rsquo;<a href=\"https:\/\/www.hostinger.com\/fr\/tutoriels\/environnement-de-developpement\/\">environnement de d&eacute;veloppement<\/a>, utilisez la commande suivante :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm install &lt;package-name&gt; --save-dev<\/pre><p class=\"wp-block-paragraph\">Par exemple, vous pouvez utiliser <strong><a href=\"https:\/\/www.npmjs.com\/package\/nodemon\" target=\"_blank\" rel=\"noreferrer noopener\">nodemon<\/a><\/strong> pour recharger votre projet lorsqu&rsquo;un fichier est modifi&eacute;. Pour installer cet outil, tapez ceci dans le terminal :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm install nodemon --save-dev <\/pre><p class=\"wp-block-paragraph\">Une fois que nodemon est install&eacute;, le terminal affichera ce message :<\/p><figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"856\" height=\"201\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/08\/nodemon-installe.jpg\/public\" alt=\"Message du terminal indiquant que nodemon a &eacute;t&eacute; install&eacute; avec succ&egrave;s.\" class=\"wp-image-12559\" title=\"message-terminal-nodemon-install&eacute;\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/08\/nodemon-installe.jpg\/w=856,fit=scale-down 856w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/08\/nodemon-installe.jpg\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/08\/nodemon-installe.jpg\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/08\/nodemon-installe.jpg\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 856px) 100vw, 856px\" \/><\/figure><p class=\"wp-block-paragraph\">Le npm ajoutera &eacute;galement la section <code data-enlighter-language=\"generic\" class=\"EnlighterJSRAW\">devDependencies<\/code> avec les nouvelles donn&eacute;es au fichier <strong>package.json<\/strong> comme ceci :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">{\n  \"name\": \"hostinger-npm\",\n  \"version\": \"1.0.0\",\n  \"description\": \"npm guide for beginner\",\n  \"main\": \"beginner-npm.js\",\n  \"scripts\": {\n    \"test\": \"echo \\\"Error: no test specified\\\" &amp;&amp; exit 1\"\n  },\n  \"keywords\": [\n    \"npm\",\n    \"example\",\n    \"basic\"\n  ],\n  \"author\": \"Hostinger International\",\n  \"license\": \"MIT\",\n  \"dependencies\": {\n    \"express\": \"^4.17.1\"\n  }\n  \"devDependencies\": {\n    \"nodemon\": \"^2.0.12\"\n  }\n}<\/pre><h3 class=\"wp-block-heading\" id=\"h-installation-globale-d-un-module-sur-votre-systeme\">Installation globale d&rsquo;un module sur votre syst&egrave;me<\/h3><p class=\"wp-block-paragraph\">Si vous souhaitez installer un paquet npm &agrave; utiliser &agrave; partir de la ligne de commande, entrez l&rsquo;une des commandes suivantes :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm install &lt;package-name&gt; --global\n\/\/ OR\nnpm i &lt;package-name&gt; -g<\/pre><p class=\"wp-block-paragraph\">Veillez &agrave; remplacer <code data-enlighter-language=\"generic\" class=\"EnlighterJSRAW\">&lt;package-name&gt;<\/code> par le nom du module.<\/p><h3 class=\"wp-block-heading\" id=\"h-mise-a-jour-de-npm\">Mise &agrave; jour de npm<\/h3><p class=\"wp-block-paragraph\">Pour que votre code et vos outils restent s&ucirc;rs et stables, mettez r&eacute;guli&egrave;rement &agrave; jour les paquets locaux et globaux t&eacute;l&eacute;charg&eacute;s depuis le registre npm.<\/p><p class=\"wp-block-paragraph\">Avant de mettre &agrave; jour un paquet npm, v&eacute;rifiez si l&rsquo;un d&rsquo;entre eux est p&eacute;rim&eacute;. Vous pouvez v&eacute;rifier quels paquets npm de votre projet ou syst&egrave;me ont des mises &agrave; jour disponibles en ex&eacute;cutant cette commande depuis le r&eacute;pertoire racine :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm outdated<\/pre><p class=\"wp-block-paragraph\">Pour v&eacute;rifier si des paquets globaux sont p&eacute;rim&eacute;s dans le syst&egrave;me, ex&eacute;cutez la commande suivante :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm outdated -g --depth=0<\/pre><p class=\"wp-block-paragraph\">Apr&egrave;s avoir obtenu la liste des modules p&eacute;rim&eacute;s, vous pouvez soit mettre &agrave; jour tous les paquets, soit un seul d&rsquo;entre eux.<\/p><p class=\"wp-block-paragraph\">Pour mettre &agrave; jour tous les paquets de votre projet, ex&eacute;cutez cette commande depuis la ligne de commande :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm update<\/pre><p class=\"wp-block-paragraph\">Pour mettre &agrave; jour un seul module, entrez ceci :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm update &lt;package-name&gt;<\/pre><p class=\"wp-block-paragraph\">N&rsquo;oubliez pas de remplacer <code data-enlighter-language=\"generic\" class=\"EnlighterJSRAW\">&lt;package-name&gt;<\/code> par le nom du paquet que vous souhaitez mettre &agrave; jour.<\/p><p class=\"wp-block-paragraph\">Pour mettre &agrave; jour tous les paquets globaux du syst&egrave;me, ex&eacute;cutez la commande suivante :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm update -g<\/pre><p class=\"wp-block-paragraph\">Afin de mettre &agrave; jour un seul paquet global, entrez la commande suivante, en rempla&ccedil;ant <code data-enlighter-language=\"generic\" class=\"EnlighterJSRAW\">&lt;package-name&gt;<\/code> par le nom du module :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm update -g &lt;package-name&gt;<\/pre><p class=\"wp-block-paragraph\">Pour mettre &agrave; jour votre gestionnaire de paquets Node lui-m&ecirc;me, ex&eacute;cutez la commande suivante :<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm install npm@latest -g<\/pre><p class=\"wp-block-paragraph\">Une fois que la derni&egrave;re version de npm a &eacute;t&eacute; install&eacute;e, la fen&ecirc;tre du terminal affichera un message comme celui-ci :<\/p><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" width=\"599\" height=\"55\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/08\/derniere-version-npm.jpg\/public\" alt=\"Message du terminal indiquant que la derni&egrave;re version de npm a &eacute;t&eacute; install&eacute;e.\" class=\"wp-image-12560\" title=\"derni&egrave;re-version-npm-install&eacute;e\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/08\/derniere-version-npm.jpg\/w=599,fit=scale-down 599w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/08\/derniere-version-npm.jpg\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/08\/derniere-version-npm.jpg\/w=150,fit=scale-down 150w\" sizes=\"(max-width: 599px) 100vw, 599px\" \/><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Pour d&rsquo;autres commandes CLI de npm, consultez la <a href=\"https:\/\/docs.npmjs.com\/cli\/v7\/commands\" target=\"_blank\" rel=\"noreferrer noopener\">documentation des commandes de npm<\/a>.<\/p><figure class=\"wp-block-image size-full\"><a href=\"https:\/\/www.hostinger.com\/fr\" target=\"_blank\" rel=\"noreferrer noopener\"><img decoding=\"async\" width=\"1024\" height=\"300\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/12\/FR-Web-hosting_in-text-banner-1-1024x300-1.png\/public\" alt=\"\" class=\"wp-image-41467\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/12\/FR-Web-hosting_in-text-banner-1-1024x300-1.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/12\/FR-Web-hosting_in-text-banner-1-1024x300-1.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/12\/FR-Web-hosting_in-text-banner-1-1024x300-1.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/12\/FR-Web-hosting_in-text-banner-1-1024x300-1.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure><h2 class=\"wp-block-heading\" id=\"h-conclusion\">Conclusion<\/h2><p class=\"wp-block-paragraph\">npm est un gestionnaire de paquets populaire qui permet aux d&eacute;veloppeurs JavaScript de partager et de d&eacute;ployer des paquets utiles rapidement et facilement.<\/p><p class=\"wp-block-paragraph\">Chaque projet npm contient un fichier appel&eacute; <strong>package.json<\/strong> dans son r&eacute;pertoire racine. Ce fichier comprend les m&eacute;tadonn&eacute;es du projet, ce qui permet &agrave; quiconque de trouver le module sur le r&eacute;pertoire npm.<\/p><p class=\"wp-block-paragraph\">En plus de contenir les informations essentielles sur le projet, <strong>package.json<\/strong> stocke &eacute;galement la liste des d&eacute;pendances du projet n&eacute;cessaires &agrave; son fonctionnement.<\/p><p class=\"wp-block-paragraph\">De plus, les paquets que les d&eacute;veloppeurs ont install&eacute;s pour les aider pendant le processus de d&eacute;veloppement seront inclus dans le <strong>package.json<\/strong> sous devDependencies.<\/p><p class=\"wp-block-paragraph\">Voici un aper&ccedil;u des commandes npm pour vous aider &agrave; d&eacute;marrer et &agrave; effectuer des t&acirc;ches de base avec ce gestionnaire de paquets :<\/p><ul class=\"wp-block-list\">\n<li><strong>V&eacute;rifier la version de npm :<\/strong><\/li>\n<\/ul><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm -v<\/pre><ul class=\"wp-block-list\">\n<li><strong>Initialiser un projet :<\/strong><\/li>\n<\/ul><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm init<\/pre><ul class=\"wp-block-list\">\n<li><strong>Installer des modules :<\/strong><\/li>\n<\/ul><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm install &lt;package-name&gt;<\/pre><ul class=\"wp-block-list\">\n<li><strong>Installer un paquet en tant que d&eacute;pendance de d&eacute;veloppement :<\/strong><\/li>\n<\/ul><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm install &lt;package-name&gt; --save-dev<\/pre><ul class=\"wp-block-list\">\n<li><strong>Installer un module globalement sur le syst&egrave;me :<\/strong><\/li>\n<\/ul><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm install &lt;package-name&gt; --global<\/pre><ul class=\"wp-block-list\">\n<li><strong>Mettre &agrave; jour tous les paquets d&rsquo;un projet :<\/strong><\/li>\n<\/ul><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm update<\/pre><ul class=\"wp-block-list\">\n<li><strong>Mettre &agrave; jour la derni&egrave;re version de npm :<\/strong><\/li>\n<\/ul><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm install npm@latest -g<\/pre><p class=\"wp-block-paragraph\">Nous esp&eacute;rons que cet article vous a aid&eacute; &agrave; comprendre ce qu&rsquo;est npm et vous a fourni quelques indications pour commencer &agrave; travailler avec lui. N&rsquo;h&eacute;sitez pas &agrave; laisser un commentaire ci-dessous si vous avez des questions.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Avec npm (Node package manager), les d&eacute;veloppeurs JavaScript peuvent d&eacute;couvrir et installer des paquets (packages) de code Node.js dans leurs applications r&eacute;seau ou leurs projets backend (c&ocirc;t&eacute; serveur). Un paquet node.js est un r&eacute;pertoire contenant un ou plusieurs modules ou biblioth&egrave;ques JavaScript utilis&eacute;s pour ajouter diverses fonctionnalit&eacute;s aux applications ou aux scripts. Sans paquets, un [&#8230;]<\/p>\n<p><a class=\"btn btn-secondary understrap-read-more-link\" href=\"\/fr\/tutoriels\/quest-ce-que-npm\/\">Read More&#8230;<\/a><\/p>\n","protected":false},"author":212,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"rank_math_title":"NPM : Tout Savoir sur le Package Manager de Node JS","rank_math_description":"Pour apprendre \u00e0 utiliser l'installation et l'utilisation des commandes du Node package manager (NPM), suivez cet article !","rank_math_focus_keyword":"node npm","footnotes":""},"categories":[5898,5847],"tags":[5728,5397,5398,5729,5727,5704],"class_list":["post-8573","post","type-post","status-publish","format-standard","hentry","category-developpement-de-site-web","category-site-web","tag-ied","tag-nodejs","tag-npm","tag-npmd","tag-pnpm","tag-quest-ce-que-npm"],"hreflangs":[{"locale":"en-US","link":"https:\/\/www.hostinger.com\/tutorials\/what-is-npm\/","default":1},{"locale":"pt-BR","link":"https:\/\/www.hostinger.com\/br\/tutoriais\/o-que-e-npm\/","default":0},{"locale":"fr-FR","link":"https:\/\/www.hostinger.com\/fr\/tutoriels\/quest-ce-que-npm\/","default":0},{"locale":"es-ES","link":"https:\/\/www.hostinger.com\/es\/tutoriales\/que-es-npm\/","default":0},{"locale":"id-ID","link":"https:\/\/www.hostinger.com\/id\/tutorial\/apa-itu-npm\/","default":0},{"locale":"ja-JP","link":"https:\/\/www.hostinger.com\/jp\/tutorials\/http-error-when-uploading-images-to-wordpress\/","default":0},{"locale":"en-PH","link":"https:\/\/www.hostinger.com\/ph\/tutorials\/what-is-npm-a-basic-introduction-for-beginners\/","default":0},{"locale":"en-MY","link":"https:\/\/www.hostinger.com\/my\/tutorials\/what-is-npm-a-basic-introduction-for-beginners\/","default":0},{"locale":"en-GB","link":"https:\/\/www.hostinger.com\/uk\/tutorials\/what-is-npm\/","default":0},{"locale":"en-IN","link":"https:\/\/www.hostinger.com\/in\/tutorials\/what-is-npm\/","default":0},{"locale":"en-CA","link":"https:\/\/www.hostinger.com\/ca\/tutorials\/what-is-npm\/","default":0},{"locale":"en-AU","link":"https:\/\/www.hostinger.com\/au\/tutorials\/what-is-npm\/","default":0},{"locale":"en-NG","link":"https:\/\/www.hostinger.com\/ng\/tutorials\/what-is-npm\/","default":0},{"locale":"es-AR","link":"https:\/\/www.hostinger.com\/ar\/tutoriales\/que-es-npm\/","default":0},{"locale":"es-MX","link":"https:\/\/www.hostinger.com\/mx\/tutoriales\/que-es-npm\/","default":0},{"locale":"es-CO","link":"https:\/\/www.hostinger.com\/co\/tutoriales\/que-es-npm\/","default":0},{"locale":"pt-PT","link":"https:\/\/www.hostinger.com\/pt\/tutoriais\/o-que-e-npm\/","default":0}],"_links":{"self":[{"href":"https:\/\/www.hostinger.com\/fr\/tutoriels\/wp-json\/wp\/v2\/posts\/8573","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hostinger.com\/fr\/tutoriels\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hostinger.com\/fr\/tutoriels\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/fr\/tutoriels\/wp-json\/wp\/v2\/users\/212"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/fr\/tutoriels\/wp-json\/wp\/v2\/comments?post=8573"}],"version-history":[{"count":71,"href":"https:\/\/www.hostinger.com\/fr\/tutoriels\/wp-json\/wp\/v2\/posts\/8573\/revisions"}],"predecessor-version":[{"id":38728,"href":"https:\/\/www.hostinger.com\/fr\/tutoriels\/wp-json\/wp\/v2\/posts\/8573\/revisions\/38728"}],"wp:attachment":[{"href":"https:\/\/www.hostinger.com\/fr\/tutoriels\/wp-json\/wp\/v2\/media?parent=8573"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hostinger.com\/fr\/tutoriels\/wp-json\/wp\/v2\/categories?post=8573"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hostinger.com\/fr\/tutoriels\/wp-json\/wp\/v2\/tags?post=8573"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}