{"id":923,"date":"2024-07-12T11:51:52","date_gmt":"2024-07-12T06:21:52","guid":{"rendered":"https:\/\/www.mrcoder701.com\/?p=923"},"modified":"2024-07-25T16:00:33","modified_gmt":"2024-07-25T10:30:33","slug":"introduction-to-the-npm-package-manager","status":"publish","type":"post","link":"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/","title":{"rendered":"Introduction to the npm package manager"},"content":{"rendered":"<p>Have you ever been curious about how developers can handle the many packages and dependencies in their Node.js projects? Enter the Node Package Manager, which is at the core of the Node.js ecosystem. It makes sharing, installation, and management of code packages easy. Let&#8217;s check out NPM right from installation to the tips that will see you be a super user of it.<\/p><h1 class=\"wp-block-heading has-vivid-green-cyan-color has-text-color has-link-color wp-elements-4ff371648d90f77eaa06d1858edd0ca7\">What is NPM?<\/h1><p><code>npm<\/code>&nbsp;is the standard package manager for Node.js.<\/p><p>NPM is the default package manager for Node.js. It enables developers to share and reuse packages of code. Through it, they can access the world&#8217;s largest software registry\u2014hundreds of thousands of code packages are available in a couple of seconds. No matter whether you are working on a small project or a big application, NPM allows you to manage your dependencies the easy way.<\/p><p>in September 2022 over 2.1 million packages were reported being listed in the npm registry, making it the biggest single language code repository on Earth, and you can be sure there is a package for (almost!) everything.<\/p><p>It started as a way to download and manage dependencies of Node.js packages, but it has since become a tool used also in frontend JavaScript.<\/p><blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\"><p><a href=\"https:\/\/yarnpkg.com\/en\/\"><strong>Yarn<\/strong><\/a>&nbsp;and&nbsp;<a href=\"https:\/\/pnpm.io\/\"><strong>pnpm<\/strong><\/a>&nbsp;are alternatives to npm cli. You can check them out as well.<\/p><\/blockquote><div class=\"wp-block-boldblocks-icon-separator\" role=\"separator\"><div class=\"wp-block-boldblocks-icon-separator__inner icon-center is-align-center\" style=\"--bb-border:1px solid;--bb--icon-width:1em;--bb--icon-spacing:.5em\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 512 512\">\n  <path d=\"M388 288a76 76 0 1 0 76 76 76.24 76.24 0 0 0-76-76Zm-264 0a76 76 0 1 0 76 76 76.24 76.24 0 0 0-76-76Z\" style=\"fill:none;stroke:#000;stroke-miterlimit:10;stroke-width:32px\"><\/path>\n  <path d=\"M256 360v-86l-64-42 80-88 40 72h56\" style=\"fill:none;stroke:#000;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px\"><\/path>\n  <path d=\"M320 136a31.89 31.89 0 0 0 32-32.1A31.55 31.55 0 0 0 320.2 72a32 32 0 1 0-.2 64\"><\/path>\n<\/svg><\/div><\/div><h1 class=\"wp-block-heading has-vivid-green-cyan-color has-text-color has-link-color wp-elements-3830f75f776e6c1007af9f4f382f9d1c\">Why Use NPM?<\/h1><ul class=\"wp-block-list\"><li><strong>Dependency Management Made Simple<\/strong>: Installing, updating, and managing libraries and frameworks is made easy.<\/li>\n\n<li><strong>Community and Support<\/strong>: Get hold of a huge repository of open-source packages kept up-to-date by an enormous community.<\/li>\n\n<li><strong>Automation<\/strong>: Automate repetitive tasks with NPM scripts.<\/li><\/ul><div class=\"wp-block-boldblocks-icon-separator\" role=\"separator\"><div class=\"wp-block-boldblocks-icon-separator__inner icon-center is-align-center\" style=\"--bb-border:1px solid;--bb--icon-width:1em;--bb--icon-spacing:.5em\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 20 20\">\n  <path d=\"M9 2h2v12l4-4 2 1-7 7-7-7 2-1 4 4z\"><\/path>\n<\/svg><\/div><\/div><h1 class=\"wp-block-heading has-vivid-green-cyan-color has-text-color has-link-color wp-elements-6781be64b34e08dd1d9404392cd3e225\" id=\"the-npm-command-line-interface-cli\">The npm Command Line Interface (CLI)<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#the-npm-command-line-interface-cli\"><\/a><\/h1><p>The npm command line interface allows users to install and uninstall packages, check npm version, run scripts, create package.json files, and more.<\/p><p>As we progress through this tutorial, we will see some examples of how to use the command line interface.<\/p><p>On a Windows computer, we commonly refer to the command line interface as Command Prompt. On a Mac computer, it&#8217;s known as the terminal.<\/p><div class=\"wp-block-boldblocks-icon-separator\" role=\"separator\"><div class=\"wp-block-boldblocks-icon-separator__inner icon-center is-align-center\" style=\"--bb-border:1px solid;--bb--icon-width:1em;--bb--icon-spacing:.5em\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 20 20\">\n  <path d=\"M9 2h2v12l4-4 2 1-7 7-7-7 2-1 4 4z\"><\/path>\n<\/svg><\/div><\/div><h1 class=\"wp-block-heading has-vivid-green-cyan-color has-text-color has-link-color wp-elements-dfce93bf858fd700fc53956fbaae8546\">Essential npm Commands and Aliases<\/h1><p>In this section, we&#8217;ll go over some of the most popular npm commands and what they do.<\/p><p class=\"has-vivid-purple-color has-text-color has-link-color wp-elements-6a2424ee0a79e6efb32a9ad7f1e34abb\"><strong>npm install<\/strong><\/p><p>This command installs packages. You can install packages globally or locally. When a package is installed globally, we can access its functionality from any directory on our computer.<\/p><p>However, if we install a package locally, we can only use it in the directory where it was installed. As a result, the package cannot be used in any other folder or file on our computer.<\/p><h5 class=\"wp-block-heading has-vivid-purple-color has-text-color has-link-color wp-elements-456c1f33e57bca9ef29c9c88cf882d29\" id=\"npm-uninstall\">npm uninstall<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#npm-uninstall\"><\/a><\/h5><p>This command is used to uninstall a package.<\/p><h5 class=\"wp-block-heading has-vivid-purple-color has-text-color has-link-color wp-elements-2616fbc2c22dd61e330b1e45e30bddf9\" id=\"npm-init\">npm init<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#npm-init\"><\/a><\/h5><p>The&nbsp;<code>init<\/code>&nbsp;command is used to initialize a project. When you run this command, it creates a&nbsp;<strong>package.json<\/strong>&nbsp;file.<\/p><p>When running&nbsp;<code>npm init<\/code>, you\u2019ll be asked to provide certain information about the project you\u2019re initializing. This information includes the project\u2019s name, the license type, the version, and so on.<\/p><p>To skip the process of providing the information yourself, you can simply run the&nbsp;<code>npm init -y<\/code>&nbsp;command.<\/p><h5 class=\"wp-block-heading has-vivid-purple-color has-text-color has-link-color wp-elements-ad39ad558bf4f46aa1099c2008797230\" id=\"npm-update\">npm update<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#npm-update\"><\/a><\/h5><p>Use this command to update an npm package to its latest version.<\/p><h5 class=\"wp-block-heading has-vivid-purple-color has-text-color has-link-color wp-elements-259f423b27ce774069e161e40792c318\" id=\"npm-restart\">npm restart<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#npm-restart\"><\/a><\/h5><p>Used to restart a package. You can use this command when you\u2019d want to stop and restart a particular project.<\/p><h5 class=\"wp-block-heading has-vivid-purple-color has-text-color has-link-color wp-elements-e75627ad967ab3bd782465801d3a718b\" id=\"npm-start\">npm start<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#npm-start\"><\/a><\/h5><p>Used to start a package when required.<\/p><h5 class=\"wp-block-heading has-vivid-purple-color has-text-color has-link-color wp-elements-b5fd78b803f7b4de6cd56ce675308d9c\" id=\"npm-stop\">npm stop<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#npm-stop\"><\/a><\/h5><p>Used to stop a package from running.<\/p><h5 class=\"wp-block-heading has-vivid-purple-color has-text-color has-link-color wp-elements-647a7a21c90dd0f484f02b0f246f90c0\" id=\"npm-version\">npm version<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#npm-version\"><\/a><\/h5><p>Shows you the current npm version installed on your computer.<\/p><h5 class=\"wp-block-heading has-vivid-purple-color has-text-color has-link-color wp-elements-20fec75122f9a34d2ece1e94f1fb42a1\" id=\"npm-publish\">npm publish<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#npm-publish\"><\/a><\/h5><p>Used to publish an npm package to the npm registry. This is mostly used when you have created your own package.<\/p><div class=\"wp-block-boldblocks-icon-separator\" role=\"separator\"><div class=\"wp-block-boldblocks-icon-separator__inner icon-center is-align-center\" style=\"--bb-border:1px solid;--bb--icon-width:1em;--bb--icon-spacing:.5em\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 20 20\">\n  <path d=\"M9 2h2v12l4-4 2 1-7 7-7-7 2-1 4 4z\"><\/path>\n<\/svg><\/div><\/div><h1 class=\"wp-block-heading has-vivid-green-cyan-color has-text-color has-link-color wp-elements-391bfa3b932f56c3512ad97b5191b5e6\" id=\"how-to-install-npm\">How To Install npm<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#how-to-install-npm\"><\/a><\/h1><p>To install npm, you\u2019d first have to&nbsp;<a href=\"https:\/\/kinsta.com\/blog\/how-to-install-node-js\/\">install Node.js<\/a>&nbsp;on your computer. To do this, head over to the&nbsp;<a href=\"https:\/\/nodejs.org\/en\/download\/\" target=\"_blank\" rel=\"noreferrer noopener\">Node.js website<\/a>&nbsp;and download it. We recommended downloading the LTS version, as it is the most stable version of Node.js.<\/p><p>Installing Node.js automatically installs npm \u2014 no separate installation is needed.<\/p><h3 class=\"wp-block-heading has-vivid-red-color has-text-color has-link-color wp-elements-7ea1327a28fb058adaac0480528ff2cb\" id=\"how-to-check-the-current-npm-version-installed-on-your-pc\">How To Check the Current npm Version Installed on Your PC<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#how-to-check-the-current-npm-version-installed-on-your-pc\"><\/a><\/h3><p>After installing Node.js, run the following commands to see your Node.js and npm versions:<\/p><div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:clamp(18px, 1.125rem, 27px);font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:clamp(26px, 1.625rem, 39px);--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#282A36\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"node -v\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki dracula\" style=\"background-color: #282A36\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F8F8F2\">node <\/span><span style=\"color: #FF79C6\">-<\/span><span style=\"color: #F8F8F2\">v<\/span><\/span><\/code><\/pre><\/div><p>The next command will show the current npm version:<\/p><div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:clamp(18px, 1.125rem, 27px);font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:clamp(26px, 1.625rem, 39px);--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#282A36\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"npm -v\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki dracula\" style=\"background-color: #282A36\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F8F8F2\">npm <\/span><span style=\"color: #FF79C6\">-<\/span><span style=\"color: #F8F8F2\">v<\/span><\/span><\/code><\/pre><\/div><div class=\"wp-block-boldblocks-icon-separator\" role=\"separator\"><div class=\"wp-block-boldblocks-icon-separator__inner icon-center is-align-center\" style=\"--bb-border:1px solid;--bb--icon-width:1em;--bb--icon-spacing:.5em\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 20 20\">\n  <path d=\"M9 2h2v12l4-4 2 1-7 7-7-7 2-1 4 4z\"><\/path>\n<\/svg><\/div><\/div><h1 class=\"wp-block-heading has-vivid-green-cyan-color has-text-color has-link-color wp-elements-5f4896556851b38185dd78911e74b4c8\" id=\"npm-packages\">npm Packages<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#npm-packages\"><\/a><\/h1><p>In this section, we&#8217;ll go over how to install and uninstall npm packages both globally and locally, as well as how to update a package, list packages, change a package&#8217;s location, and search for installed packages.<\/p><p>We&#8217;ll start by talking about what a npm package is and showing some examples of packages used by developers.<\/p><h3 class=\"wp-block-heading has-vivid-green-cyan-color has-text-color has-link-color wp-elements-ae54053a56995d9d1b4f6d6c76111c13\" id=\"what-is-an-npm-package\">What Is an Npm Package?<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#what-is-an-npm-package\"><\/a><\/h3><p>A package is simply a pre-built project that has been published to the npm directory. The creator and contributors of a package determine what it can do.<\/p><p>npm allows us to access a large number of projects created by other developers. Consider creating your own CSS framework; this would be a time-consuming task. As a result, developers create these projects and place them on the npm registry, making them easier to use and simplifying the development process.<\/p><p>One example of a npm package is Tailwind CSS, a utility-first CSS framework for creating web pages. Other popular npm packages include React, Chalk, Gulp, Bootstrap, Express, and Vue.js, among others.<\/p><div class=\"wp-block-boldblocks-icon-separator\" role=\"separator\"><div class=\"wp-block-boldblocks-icon-separator__inner icon-center is-align-center\" style=\"--bb-border:1px solid;--bb--icon-width:1em;--bb--icon-spacing:.5em\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 20 20\">\n  <path d=\"M9 2h2v12l4-4 2 1-7 7-7-7 2-1 4 4z\"><\/path>\n<\/svg><\/div><\/div><h1 class=\"wp-block-heading has-vivid-green-cyan-color has-text-color has-link-color wp-elements-fd04099999643db5f356f267d193f8b5\">Installation of Packages<\/h1><p><code>npm<\/code>&nbsp;manages downloads of dependencies of your project.<\/p><h3 class=\"wp-block-heading has-vivid-red-color has-text-color has-link-color wp-elements-9df51889303a4cf312ac22ef92843cdd\">How To Install an npm Package Globally<\/h3><p>When you install an npm package globally, you\u2019re able to access it from any directory on your computer. In this section, you\u2019ll see a practical way of installing a package globally by running an npm command in your terminal.<\/p><p>To install a package globally, use this command:<\/p><div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:clamp(18px, 1.125rem, 27px);font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:clamp(26px, 1.625rem, 39px);--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#282A36\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"npm install -g &lt;package-name&gt;\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki dracula\" style=\"background-color: #282A36\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F8F8F2\">npm install <\/span><span style=\"color: #FF79C6\">-<\/span><span style=\"color: #F8F8F2\">g <\/span><span style=\"color: #FF79C6\">&lt;package-<\/span><span style=\"color: #F8F8F2\">name<\/span><span style=\"color: #FF79C6\">&gt;<\/span><\/span><\/code><\/pre><\/div><p><strong>Note<\/strong> that the\u00a0<code>-g<\/code>\u00a0flag in the command is what enables the npm CLI to install the package globally.<\/p><p>Here is an example<\/p><div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:clamp(18px, 1.125rem, 27px);font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:clamp(26px, 1.625rem, 39px);--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#282A36\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"npm install -g http-server\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki dracula\" style=\"background-color: #282A36\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F8F8F2\">npm install <\/span><span style=\"color: #FF79C6\">-<\/span><span style=\"color: #F8F8F2\">g http<\/span><span style=\"color: #FF79C6\">-<\/span><span style=\"color: #F8F8F2\">server<\/span><\/span><\/code><\/pre><\/div><p>The command above will install\u00a0<a href=\"https:\/\/www.npmjs.com\/package\/http-server\" target=\"_blank\" rel=\"noreferrer noopener\">http-server<\/a>\u00a0globally on your computer. After the installation, you can use http-server in any directory.<\/p><p><strong>Use Cases<\/strong>:<\/p><ul class=\"wp-block-list\"><li>Tools and utilities that need to be accessed from the command line.<\/li><\/ul><p><strong>Potential Pitfalls<\/strong>:<\/p><ul class=\"wp-block-list\"><li>Version conflicts if different projects require different versions of the same package.<\/li><\/ul><div class=\"wp-block-boldblocks-icon-separator\" role=\"separator\"><div class=\"wp-block-boldblocks-icon-separator__inner icon-center is-align-center\" style=\"--bb-border:1px solid;--bb--icon-width:1em;--bb--icon-spacing:.5em\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 20 20\">\n  <path d=\"M9 2h2v12l4-4 2 1-7 7-7-7 2-1 4 4z\"><\/path>\n<\/svg><\/div><\/div><h3 class=\"wp-block-heading has-vivid-red-color has-text-color has-link-color wp-elements-60e3e53829cb1c2172b079cca9faa9a2\">How To Install an npm Package Locally<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#how-to-install-an-npm-package-locally\"><\/a><\/h3><p>in the last section, we learned how to install an npm package globally. Now, let&#8217;s discuss installing one locally. Installing a package locally refers to the process of being able to use the package&#8217;s functionality in the current directory only. To do that, you would have to navigate to the directory that you want to install the package into, and in the terminal, you would execute the command:<\/p><div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:clamp(18px, 1.125rem, 27px);font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:clamp(26px, 1.625rem, 39px);--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#282A36\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"npm install [package name]\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki dracula\" style=\"background-color: #282A36\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F8F8F2\">npm install [package name]<\/span><\/span><\/code><\/pre><\/div><p>Local packages are installed in the <code>node_modules<\/code> directory of your project and are only available within that project.<\/p><p>Here is an example:<\/p><div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:clamp(18px, 1.125rem, 27px);font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:clamp(26px, 1.625rem, 39px);--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#282A36\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"npm install http-server\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki dracula\" style=\"background-color: #282A36\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F8F8F2\">npm install http<\/span><span style=\"color: #FF79C6\">-<\/span><span style=\"color: #F8F8F2\">server<\/span><\/span><\/code><\/pre><\/div><p>The command above will install http-server locally, meaning it will only function in this current directory.<\/p><p><strong>Why Preferred<\/strong>:<\/p><ul class=\"wp-block-list\"><li>Avoids version conflicts by keeping dependencies project-specific.<\/li><\/ul><div class=\"wp-block-boldblocks-icon-separator\" role=\"separator\"><div class=\"wp-block-boldblocks-icon-separator__inner icon-center is-align-center\" style=\"--bb-border:1px solid;--bb--icon-width:1em;--bb--icon-spacing:.5em\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 20 20\">\n  <path d=\"M9 2h2v12l4-4 2 1-7 7-7-7 2-1 4 4z\"><\/path>\n<\/svg><\/div><\/div><h3 class=\"wp-block-heading has-vivid-red-color has-text-color has-link-color wp-elements-40f55ab56984a215c4f92fd8ba304afc\">How To Uninstall an npm Package Globally<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#how-to-uninstall-an-npm-package-globally\"><\/a><\/h3><p>If you no longer need a npm package, you can uninstall it from your computer.<\/p><p>To uninstall a package globally, use the following:<\/p><div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:clamp(18px, 1.125rem, 27px);font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:clamp(26px, 1.625rem, 39px);--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#282A36\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"npm uninstall -g [package name]\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki dracula\" style=\"background-color: #282A36\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F8F8F2\">npm uninstall <\/span><span style=\"color: #FF79C6\">-<\/span><span style=\"color: #F8F8F2\">g [package name]<\/span><\/span><\/code><\/pre><\/div><p>Let\u2019s see an example:<\/p><div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:clamp(18px, 1.125rem, 27px);font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:clamp(26px, 1.625rem, 39px);--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#282A36\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"npm uninstall -g http-server\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki dracula\" style=\"background-color: #282A36\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F8F8F2\">npm uninstall <\/span><span style=\"color: #FF79C6\">-<\/span><span style=\"color: #F8F8F2\">g http<\/span><span style=\"color: #FF79C6\">-<\/span><span style=\"color: #F8F8F2\">server<\/span><\/span><\/code><\/pre><\/div><p>The command in the example above will remove the http-server package from your computer.<\/p><div class=\"wp-block-boldblocks-icon-separator\" role=\"separator\"><div class=\"wp-block-boldblocks-icon-separator__inner icon-center is-align-center\" style=\"--bb-border:1px solid;--bb--icon-width:1em;--bb--icon-spacing:.5em\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 20 20\">\n  <path d=\"M9 2h2v12l4-4 2 1-7 7-7-7 2-1 4 4z\"><\/path>\n<\/svg><\/div><\/div><h3 class=\"wp-block-heading has-vivid-red-color has-text-color has-link-color wp-elements-56ff9d9da8eae3d2cd6de8f8083269cc\">How To Uninstall an npm Package Locally<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#how-to-uninstall-an-npm-package-locally\"><\/a><\/h3><p>Uninstalling a locally installed npm package is similar to the previous example, but this time we will not use the -g flag.<\/p><p>Here&#8217;s the syntax:<\/p><div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:clamp(18px, 1.125rem, 27px);font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:clamp(26px, 1.625rem, 39px);--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#282A36\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"npm uninstall [package name]\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki dracula\" style=\"background-color: #282A36\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F8F8F2\">npm uninstall [package name]<\/span><\/span><\/code><\/pre><\/div><p>And here is a working example:<\/p><div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:clamp(18px, 1.125rem, 27px);font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:clamp(26px, 1.625rem, 39px);--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#282A36\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"npm uninstall http-server\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki dracula\" style=\"background-color: #282A36\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F8F8F2\">npm uninstall http<\/span><span style=\"color: #FF79C6\">-<\/span><span style=\"color: #F8F8F2\">server<\/span><\/span><\/code><\/pre><\/div><div class=\"wp-block-boldblocks-icon-separator\" role=\"separator\"><div class=\"wp-block-boldblocks-icon-separator__inner icon-center is-align-center\" style=\"--bb-border:1px solid;--bb--icon-width:1em;--bb--icon-spacing:.5em\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 20 20\">\n  <path d=\"M9 2h2v12l4-4 2 1-7 7-7-7 2-1 4 4z\"><\/path>\n<\/svg><\/div><\/div><h1 class=\"wp-block-heading has-vivid-green-cyan-color has-text-color has-link-color wp-elements-71a3f531c3ceb5fa858f67038c16562a\">How To Update npm and Packages<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#how-to-update-npm-and-packages\"><\/a><\/h1><p>Keeping your npm and packages up to date is the most effective way to keep bugs and security flaws out of your code.<\/p><p>To update npm to the latest version, use the following command:<\/p><div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:clamp(18px, 1.125rem, 27px);font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:clamp(26px, 1.625rem, 39px);--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#282A36\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"npm install npm@latest - g\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki dracula\" style=\"background-color: #282A36\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F8F8F2\">npm install npm@latest <\/span><span style=\"color: #FF79C6\">-<\/span><span style=\"color: #F8F8F2\"> g<\/span><\/span><\/code><\/pre><\/div><p>This updates npm globally on your computer.<\/p><p>When the creators of a package add new features or fix bugs, they update the package in the npm registry. To use the new features, you must first update your own package.<\/p><p>Here&#8217;s the syntax for the command you&#8217;d use to accomplish this:<\/p><div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:clamp(18px, 1.125rem, 27px);font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:clamp(26px, 1.625rem, 39px);--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#282A36\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"npm update [package name]\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki dracula\" style=\"background-color: #282A36\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F8F8F2\">npm update [package name]<\/span><\/span><\/code><\/pre><\/div><p>And here\u2019s a working example:<\/p><div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:clamp(18px, 1.125rem, 27px);font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:clamp(26px, 1.625rem, 39px);--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#282A36\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"npm update http-server\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki dracula\" style=\"background-color: #282A36\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F8F8F2\">npm update http<\/span><span style=\"color: #FF79C6\">-<\/span><span style=\"color: #F8F8F2\">server<\/span><\/span><\/code><\/pre><\/div><p>The command above updates http-server to its latest version.<\/p><p>Additionally, just like in the previous sections, we can use the&nbsp;<code>-g<\/code>&nbsp;flag to update a package globally. That is:<\/p><div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:clamp(18px, 1.125rem, 27px);font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:clamp(26px, 1.625rem, 39px);--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#282A36\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"npm update -g http-server\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki dracula\" style=\"background-color: #282A36\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F8F8F2\">npm update <\/span><span style=\"color: #FF79C6\">-<\/span><span style=\"color: #F8F8F2\">g http<\/span><span style=\"color: #FF79C6\">-<\/span><span style=\"color: #F8F8F2\">server<\/span><\/span><\/code><\/pre><\/div><div class=\"wp-block-boldblocks-icon-separator\" role=\"separator\"><div class=\"wp-block-boldblocks-icon-separator__inner icon-center is-align-center\" style=\"--bb-border:1px solid;--bb--icon-width:1em;--bb--icon-spacing:.5em\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 20 20\">\n  <path d=\"M9 2h2v12l4-4 2 1-7 7-7-7 2-1 4 4z\"><\/path>\n<\/svg><\/div><\/div><h1 class=\"wp-block-heading has-vivid-green-cyan-color has-text-color has-link-color wp-elements-e32a2cc1e5bb889823b8aa6497853c0f\" id=\"how-to-change-location-of-npm-packages\">How To Change Location of npm Packages<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#how-to-change-location-of-npm-packages\"><\/a><\/h1><p>For some users, without administrative permission to their computer, once an npm command is run, the console will alert with an error message. This can be fixed by running a new location or directory when installing your packages, instead of the default installation location.<\/p><p>Here is the syntax for doing that:<\/p><div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:clamp(18px, 1.125rem, 27px);font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:clamp(26px, 1.625rem, 39px);--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#282A36\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"npm config set prefix [new directory path]\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki dracula\" style=\"background-color: #282A36\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F8F8F2\">npm config set prefix [<\/span><span style=\"color: #FF79C6; font-weight: bold\">new<\/span><span style=\"color: #F8F8F2\"> directory path]<\/span><\/span><\/code><\/pre><\/div><p>Once you\u2019ve set the new path for the installation of packages, all your npm packages will be saved there by default.<\/p><div class=\"wp-block-boldblocks-icon-separator\" role=\"separator\"><div class=\"wp-block-boldblocks-icon-separator__inner icon-center is-align-center\" style=\"--bb-border:1px solid;--bb--icon-width:1em;--bb--icon-spacing:.5em\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 20 20\">\n  <path d=\"M9 2h2v12l4-4 2 1-7 7-7-7 2-1 4 4z\"><\/path>\n<\/svg><\/div><\/div><h1 class=\"wp-block-heading has-vivid-green-cyan-color has-text-color has-link-color wp-elements-9db56e88f76f1c7ed4e0167408bfdb2f\" id=\"how-to-list-installed-npm-packages-globally\"><strong>How To List Installed npm Packages Globally<\/strong><a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#how-to-list-installed-npm-packages-globally\"><\/a><\/h1><p>If you want to know how many packages are installed on your computer, npm has a command that will list them all.<\/p><p>Entering the command below will list all the packages installed globally on your device:<\/p><div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:clamp(18px, 1.125rem, 27px);font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:clamp(26px, 1.625rem, 39px);--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#282A36\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"npm list -g\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki dracula\" style=\"background-color: #282A36\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F8F8F2\">npm list <\/span><span style=\"color: #FF79C6\">-<\/span><span style=\"color: #F8F8F2\">g<\/span><\/span><\/code><\/pre><\/div><p>When you run the command above, you will see a list of all the packages you have previously installed on your computer.<\/p><p>In the following section, we&#8217;ll look at how to list the npm packages that are currently installed locally.<\/p><div class=\"wp-block-boldblocks-icon-separator\" role=\"separator\"><div class=\"wp-block-boldblocks-icon-separator__inner icon-center is-align-center\" style=\"--bb-border:1px solid;--bb--icon-width:1em;--bb--icon-spacing:.5em\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 20 20\">\n  <path d=\"M9 2h2v12l4-4 2 1-7 7-7-7 2-1 4 4z\"><\/path>\n<\/svg><\/div><\/div><h1 class=\"wp-block-heading has-vivid-green-cyan-color has-text-color has-link-color wp-elements-135fa72c8fd67e010fa8b16fc227ca73\" id=\"how-to-list-installed-npm-packages-locally\">How To List Installed npm Packages Locally<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#how-to-list-installed-npm-packages-locally\"><\/a><\/h1><p>Similar to the previous section, we can list locally installed npm packages.<\/p><p>To view a list of locally installed packages, run the following command in your terminal:<\/p><div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:clamp(18px, 1.125rem, 27px);font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:clamp(26px, 1.625rem, 39px);--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#282A36\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"npm list\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki dracula\" style=\"background-color: #282A36\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F8F8F2\">npm list<\/span><\/span><\/code><\/pre><\/div><p>To see all of the packages installed for your project, run the command above in its directory.<\/p><div class=\"wp-block-boldblocks-icon-separator\" role=\"separator\"><div class=\"wp-block-boldblocks-icon-separator__inner icon-center is-align-center\" style=\"--bb-border:1px solid;--bb--icon-width:1em;--bb--icon-spacing:.5em\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 20 20\">\n  <path d=\"M9 2h2v12l4-4 2 1-7 7-7-7 2-1 4 4z\"><\/path>\n<\/svg><\/div><\/div><h1 class=\"wp-block-heading has-vivid-green-cyan-color has-text-color has-link-color wp-elements-64d05b8cebc9c87a306d60c6c4ac6271\" id=\"how-to-change-location-of-npm-packages\">How To Search for npm Packages<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#how-to-search-for-npm-packages\"><\/a><\/h1><p>There are more than 1.3 million packages in the npm registry, and each of them has different functionalities. The right package depends on your needs and goals. There are packages you&#8217;re required to use when working with certain development stacks. For instance, a popular package in React is React Router which is used for routing in React. Other tech stacks need some other packages, too. Searching in a search bar on the <strong><mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-vivid-cyan-blue-color\"><a href=\"https:\/\/www.npmjs.com\/\">npm<\/a> <\/mark><\/strong>website will give you information about the packages, and it&#8217;s good to know what they are and what each package does and comes along with its installation and features. Look for packages that are regularly maintained, i.e., packages that are currently being tested, fixed, and improved by community developers regularly.<\/p><div class=\"wp-block-boldblocks-icon-separator\" role=\"separator\"><div class=\"wp-block-boldblocks-icon-separator__inner icon-center is-align-center\" style=\"--bb-border:1px solid;--bb--icon-width:1em;--bb--icon-spacing:.5em\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 20 20\">\n  <path d=\"M9 2h2v12l4-4 2 1-7 7-7-7 2-1 4 4z\"><\/path>\n<\/svg><\/div><\/div><h1 class=\"wp-block-heading has-vivid-green-cyan-color has-text-color has-link-color wp-elements-c132e949ac8c648b142c86b011078461\">More npm Files and Folders<\/h1><p>All right, now that we have a basic understanding about what npm packages are and how we can use them in our project, let us get to know some of the other files and folders involved with an npm-based project.<\/p><h2 class=\"wp-block-heading has-vivid-red-color has-text-color has-link-color wp-elements-88d65c597c18a2545c6310b77fdd1f01\"><strong>The package.json File<\/strong><\/h2><p>The package.json file lets us keep track of all the installed packages in a certain project. You should create this file while developing a new project since it is where all the details about the project are stored: the name of the project, version, scripts, dependencies, and others. Simply create it by running either <code>npm init<\/code> or <code>npm init -y<\/code> in the terminal of the project, and then answer all the questions that the system asks to create the file.<\/p><p>This is after the creation of a package.json file, which stores all installed packages with their names and versions in the file. Another important use of the package.json file is when we clone projects in GitHub. When developers push their project to a repository, they leave out the node_modules folder, which contains our packages and their dependencies.<\/p><p>After cloning a repo, for you to generate your own folder, you do the command <code>npm install<\/code> in your project terminal. This will enable npm to go through the package.json file in the repository and install all the packages listed in it. Once that installation is done, you can then make use of all these packages that you had previously installed for that project before it is pushed to GitHub.<\/p><h2 class=\"wp-block-heading has-vivid-red-color has-text-color has-link-color wp-elements-c5f9c4882cbf07b7a09b978c5fa21ae7\">What Are npm Dependencies?<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#what-are-npm-dependencies\"><\/a><\/h2><p>When we install packages, a node_modules folder is created where we can see other folders: each package has its own folder and subfolders. Therefore, at this point, you may be asking yourself why those other folders are there if you didn&#8217;t install them.<\/p><p>In your package.json file, your packages are being listed under the dependencies key because your project is &#8220;depending&#8221; on those packages to get the work done. The other folders created in your node_modules folder are additional packages that have been installed, depending on the packages you have installed. This allows you to easily confirm this by looking up a package.json file for any installed package to review the included dependencies.<\/p><div class=\"wp-block-boldblocks-icon-separator\" role=\"separator\"><div class=\"wp-block-boldblocks-icon-separator__inner icon-center is-align-center\" style=\"--bb-border:1px solid;--bb--icon-width:1em;--bb--icon-spacing:.5em\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 20 20\">\n  <path d=\"M9 2h2v12l4-4 2 1-7 7-7-7 2-1 4 4z\"><\/path>\n<\/svg><\/div><\/div><h2 class=\"wp-block-heading has-vivid-red-color has-text-color has-link-color wp-elements-e1e710ce944fde38e83d39e1909b6cae\">What Are npm Scripts?<a href=\"https:\/\/kinsta.com\/knowledgebase\/what-is-npm\/#what-are-npm-scripts\"><\/a><\/h2><p>Simply stated, this means that npm scripts are your way of providing custom scripts in your package.json file in order to do a little work for you automatically. You can also create scripts of your own with regard to doing a lot of other things, such as code minification of your CSS, restarting the server on changes, and building a project to be ready for production.<\/p><p>Typically, a test script comes with package.json when created. There is a lot we can do using scripts: start a server, minify our CSS, and even bundle our code for production.<\/p><p>A good example of this is the widely used npm run start in React, which spins up our development server at localhost:3000. We can actually run our other scripts by doing this same syntax of command as above:<\/p><div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:clamp(18px, 1.125rem, 27px);font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:clamp(26px, 1.625rem, 39px);--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#282A36\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"npm run [script-name]\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki dracula\" style=\"background-color: #282A36\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F8F8F2\">npm run [script<\/span><span style=\"color: #FF79C6\">-<\/span><span style=\"color: #F8F8F2\">name]<\/span><\/span><\/code><\/pre><\/div><div class=\"wp-block-boldblocks-icon-separator\" role=\"separator\"><div class=\"wp-block-boldblocks-icon-separator__inner icon-center is-align-center\" style=\"--bb-border:1px solid;--bb--icon-width:1em;--bb--icon-spacing:.5em\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 20 20\">\n  <path d=\"M9 2h2v12l4-4 2 1-7 7-7-7 2-1 4 4z\"><\/path>\n<\/svg><\/div><\/div><h2 class=\"wp-block-heading\">Summary<\/h2><p>Eventually, npm turns into one of the most necessary tools for developing web applications based on Node.js. npm gives access to millions of deployed projects by other developers, which are in turn free to use and enhance one&#8217;s own project.<\/p><p>A versatile set of packages is within npm, including CSS frameworks, file bundlers, JavaScript frameworks, backend tools, and many others. Most of these projects are safe for others to use while developing and are often maintained and updated.<\/p><p>Now web app development is slightly less of a headache with npm; there is no need to rebuild the wheel. We just have to install another developer&#8217;s package and save ourselves hours of coding.<\/p><p>Also, as developers we also have the permission to build our own packages in the npm environment and publish for other developers to use. Just like users of the WordPress community are helping to contribute towards the overall success and development of the WordPress platform, same can be done by members of the Node.js community.<\/p><p>Have you created any tool that aids in your development phase that you\u2019d love other developers to use? Share your thoughts in the comment section!<\/p><p><strong>Happy coding!<\/strong><\/p><p class=\"has-vivid-red-color has-text-color has-link-color wp-elements-b1328f87d84d956a68e686df75549643\"><strong>Leave a response to this article by providing your insights, comments, or requests for future articles.<\/strong><\/p><p class=\"has-vivid-red-color has-text-color has-link-color wp-elements-cef85d374a7330d12ea261c6c53bbb09\" id=\"f6ba\"><strong>Share the articles with your friends and colleagues on social media.<\/strong><\/p><p class=\"has-vivid-red-color has-text-color has-link-color wp-elements-8c76242b09eb6599f905df9d8473d038\" id=\"80f2\"><strong>Let\u2019s Get in Touch! Follow me on :<\/strong><\/p><h4 class=\"wp-block-heading\" id=\"bca9\">&gt;GitHub:&nbsp;<a href=\"https:\/\/github.com\/gajanan0707\" rel=\"noreferrer noopener\" target=\"_blank\">@gajanan0707<\/a><\/h4><h4 class=\"wp-block-heading\" id=\"e07f\">&gt;LinkedIn:&nbsp;<a href=\"https:\/\/www.linkedin.com\/in\/gajanan-patil-0124b7145\/\" rel=\"noreferrer noopener\" target=\"_blank\">Gajanan Rajput<\/a><\/h4><h4 class=\"wp-block-heading\" id=\"e92d\">&gt;Website:&nbsp;<a href=\"https:\/\/mrcoder701.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">https:\/\/mrcoder701.com<\/a><\/h4><h4 class=\"wp-block-heading\">&gt;YouTube:&nbsp;<a href=\"https:\/\/www.youtube.com\/@mrcoder701\">mrcoder701<\/a><\/h4><h4 class=\"wp-block-heading\">&gt; Instagram:&nbsp;<a href=\"https:\/\/www.instagram.com\/mr_coder_701\/\">mr_coder_701<\/a><\/h4><figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Green-White-Gray-Modern-Group-Project-Presentation-1024x576.jpg\" alt=\"thank_you\" class=\"wp-image-905\"\/><figcaption class=\"wp-element-caption\">thank_you<\/figcaption><\/figure><p><\/p>","protected":false},"excerpt":{"rendered":"<p>npm stands for Node Package Manager. It&#8217;s a library and registry for JavaScript software packages. npm also has command-line tools to help you install the different packages and manage their dependencies.<\/p>\n","protected":false},"author":2,"featured_media":926,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[162,17],"tags":[163],"class_list":["post-923","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-nodejs","category-programming","tag-nodejslearn"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.3 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Introduction to the npm package manager - &#x1f31f;Code with MrCoder7&#xfe0f;&#x20e3;0&#xfe0f;&#x20e3;1&#xfe0f;&#x20e3;<\/title>\n<meta name=\"description\" content=\"npm stands for Node Package Manager. It&#039;s a library and registry for JavaScript software packages. npm also has command-line tools to help you install the different packages and manage their dependencies.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Introduction to the npm package manager - &#x1f31f;Code with MrCoder7&#xfe0f;&#x20e3;0&#xfe0f;&#x20e3;1&#xfe0f;&#x20e3;\" \/>\n<meta property=\"og:description\" content=\"npm stands for Node Package Manager. It&#039;s a library and registry for JavaScript software packages. npm also has command-line tools to help you install the different packages and manage their dependencies.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/\" \/>\n<meta property=\"og:site_name\" content=\"&#x1f31f;Code with MrCoder7&#xfe0f;&#x20e3;0&#xfe0f;&#x20e3;1&#xfe0f;&#x20e3;\" \/>\n<meta property=\"article:published_time\" content=\"2024-07-12T06:21:52+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-07-25T10:30:33+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Yellow-And-Gray-Modern-Fashion-Blog-Banner-1.png\" \/>\n\t<meta property=\"og:image:width\" content=\"2240\" \/>\n\t<meta property=\"og:image:height\" content=\"1260\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"mr.coder\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"mr.coder\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"11 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/\"},\"author\":{\"name\":\"mr.coder\",\"@id\":\"https:\/\/www.mrcoder701.com\/#\/schema\/person\/ba1cd6b2ad26df384b1a655341eaef5d\"},\"headline\":\"Introduction to the npm package manager\",\"datePublished\":\"2024-07-12T06:21:52+00:00\",\"dateModified\":\"2024-07-25T10:30:33+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/\"},\"wordCount\":2480,\"commentCount\":1,\"publisher\":{\"@id\":\"https:\/\/www.mrcoder701.com\/#\/schema\/person\/ba1cd6b2ad26df384b1a655341eaef5d\"},\"image\":{\"@id\":\"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Yellow-And-Gray-Modern-Fashion-Blog-Banner-1.png\",\"keywords\":[\"NodeJsLearn\"],\"articleSection\":[\"NodeJs\",\"Programming\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/\",\"url\":\"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/\",\"name\":\"Introduction to the npm package manager - &#x1f31f;Code with MrCoder7&#xfe0f;&#x20e3;0&#xfe0f;&#x20e3;1&#xfe0f;&#x20e3;\",\"isPartOf\":{\"@id\":\"https:\/\/www.mrcoder701.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Yellow-And-Gray-Modern-Fashion-Blog-Banner-1.png\",\"datePublished\":\"2024-07-12T06:21:52+00:00\",\"dateModified\":\"2024-07-25T10:30:33+00:00\",\"description\":\"npm stands for Node Package Manager. It's a library and registry for JavaScript software packages. npm also has command-line tools to help you install the different packages and manage their dependencies.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/#primaryimage\",\"url\":\"https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Yellow-And-Gray-Modern-Fashion-Blog-Banner-1.png\",\"contentUrl\":\"https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Yellow-And-Gray-Modern-Fashion-Blog-Banner-1.png\",\"width\":2240,\"height\":1260,\"caption\":\"node package manager\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.mrcoder701.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Introduction to the npm package manager\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.mrcoder701.com\/#website\",\"url\":\"https:\/\/www.mrcoder701.com\/\",\"name\":\"Blog With MrCoder701\",\"description\":\"Blog related to programming\",\"publisher\":{\"@id\":\"https:\/\/www.mrcoder701.com\/#\/schema\/person\/ba1cd6b2ad26df384b1a655341eaef5d\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.mrcoder701.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\/\/www.mrcoder701.com\/#\/schema\/person\/ba1cd6b2ad26df384b1a655341eaef5d\",\"name\":\"mr.coder\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.mrcoder701.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/06\/369B947D-A5EE-4B16-816A-5EE55D1DDF96_L0_001-10_6_2024-6-13-24-PM.png\",\"contentUrl\":\"https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/06\/369B947D-A5EE-4B16-816A-5EE55D1DDF96_L0_001-10_6_2024-6-13-24-PM.png\",\"width\":500,\"height\":500,\"caption\":\"mr.coder\"},\"logo\":{\"@id\":\"https:\/\/www.mrcoder701.com\/#\/schema\/person\/image\/\"},\"sameAs\":[\"https:\/\/mrcoder701.com\",\"https:\/\/www.instagram.com\/mr_coder_701\/\",\"https:\/\/www.youtube.com\/@mrcoder701\"],\"url\":\"https:\/\/www.mrcoder701.com\/author\/admin\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Introduction to the npm package manager - &#x1f31f;Code with MrCoder7&#xfe0f;&#x20e3;0&#xfe0f;&#x20e3;1&#xfe0f;&#x20e3;","description":"npm stands for Node Package Manager. It's a library and registry for JavaScript software packages. npm also has command-line tools to help you install the different packages and manage their dependencies.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/","og_locale":"en_US","og_type":"article","og_title":"Introduction to the npm package manager - &#x1f31f;Code with MrCoder7&#xfe0f;&#x20e3;0&#xfe0f;&#x20e3;1&#xfe0f;&#x20e3;","og_description":"npm stands for Node Package Manager. It's a library and registry for JavaScript software packages. npm also has command-line tools to help you install the different packages and manage their dependencies.","og_url":"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/","og_site_name":"&#x1f31f;Code with MrCoder7&#xfe0f;&#x20e3;0&#xfe0f;&#x20e3;1&#xfe0f;&#x20e3;","article_published_time":"2024-07-12T06:21:52+00:00","article_modified_time":"2024-07-25T10:30:33+00:00","og_image":[{"width":2240,"height":1260,"url":"https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Yellow-And-Gray-Modern-Fashion-Blog-Banner-1.png","type":"image\/png"}],"author":"mr.coder","twitter_card":"summary_large_image","twitter_misc":{"Written by":"mr.coder","Est. reading time":"11 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/#article","isPartOf":{"@id":"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/"},"author":{"name":"mr.coder","@id":"https:\/\/www.mrcoder701.com\/#\/schema\/person\/ba1cd6b2ad26df384b1a655341eaef5d"},"headline":"Introduction to the npm package manager","datePublished":"2024-07-12T06:21:52+00:00","dateModified":"2024-07-25T10:30:33+00:00","mainEntityOfPage":{"@id":"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/"},"wordCount":2480,"commentCount":1,"publisher":{"@id":"https:\/\/www.mrcoder701.com\/#\/schema\/person\/ba1cd6b2ad26df384b1a655341eaef5d"},"image":{"@id":"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/#primaryimage"},"thumbnailUrl":"https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Yellow-And-Gray-Modern-Fashion-Blog-Banner-1.png","keywords":["NodeJsLearn"],"articleSection":["NodeJs","Programming"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/","url":"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/","name":"Introduction to the npm package manager - &#x1f31f;Code with MrCoder7&#xfe0f;&#x20e3;0&#xfe0f;&#x20e3;1&#xfe0f;&#x20e3;","isPartOf":{"@id":"https:\/\/www.mrcoder701.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/#primaryimage"},"image":{"@id":"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/#primaryimage"},"thumbnailUrl":"https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Yellow-And-Gray-Modern-Fashion-Blog-Banner-1.png","datePublished":"2024-07-12T06:21:52+00:00","dateModified":"2024-07-25T10:30:33+00:00","description":"npm stands for Node Package Manager. It's a library and registry for JavaScript software packages. npm also has command-line tools to help you install the different packages and manage their dependencies.","breadcrumb":{"@id":"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/#primaryimage","url":"https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Yellow-And-Gray-Modern-Fashion-Blog-Banner-1.png","contentUrl":"https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Yellow-And-Gray-Modern-Fashion-Blog-Banner-1.png","width":2240,"height":1260,"caption":"node package manager"},{"@type":"BreadcrumbList","@id":"https:\/\/www.mrcoder701.com\/2024\/07\/12\/introduction-to-the-npm-package-manager\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.mrcoder701.com\/"},{"@type":"ListItem","position":2,"name":"Introduction to the npm package manager"}]},{"@type":"WebSite","@id":"https:\/\/www.mrcoder701.com\/#website","url":"https:\/\/www.mrcoder701.com\/","name":"Blog With MrCoder701","description":"Blog related to programming","publisher":{"@id":"https:\/\/www.mrcoder701.com\/#\/schema\/person\/ba1cd6b2ad26df384b1a655341eaef5d"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.mrcoder701.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":["Person","Organization"],"@id":"https:\/\/www.mrcoder701.com\/#\/schema\/person\/ba1cd6b2ad26df384b1a655341eaef5d","name":"mr.coder","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.mrcoder701.com\/#\/schema\/person\/image\/","url":"https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/06\/369B947D-A5EE-4B16-816A-5EE55D1DDF96_L0_001-10_6_2024-6-13-24-PM.png","contentUrl":"https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/06\/369B947D-A5EE-4B16-816A-5EE55D1DDF96_L0_001-10_6_2024-6-13-24-PM.png","width":500,"height":500,"caption":"mr.coder"},"logo":{"@id":"https:\/\/www.mrcoder701.com\/#\/schema\/person\/image\/"},"sameAs":["https:\/\/mrcoder701.com","https:\/\/www.instagram.com\/mr_coder_701\/","https:\/\/www.youtube.com\/@mrcoder701"],"url":"https:\/\/www.mrcoder701.com\/author\/admin\/"}]}},"rttpg_featured_image_url":{"full":["https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Yellow-And-Gray-Modern-Fashion-Blog-Banner-1.png",2240,1260,false],"landscape":["https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Yellow-And-Gray-Modern-Fashion-Blog-Banner-1.png",2240,1260,false],"portraits":["https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Yellow-And-Gray-Modern-Fashion-Blog-Banner-1.png",2240,1260,false],"thumbnail":["https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Yellow-And-Gray-Modern-Fashion-Blog-Banner-1-150x150.png",150,150,true],"medium":["https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Yellow-And-Gray-Modern-Fashion-Blog-Banner-1-300x169.png",300,169,true],"large":["https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Yellow-And-Gray-Modern-Fashion-Blog-Banner-1-1024x576.png",1024,576,true],"1536x1536":["https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Yellow-And-Gray-Modern-Fashion-Blog-Banner-1-1536x864.png",1536,864,true],"2048x2048":["https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Yellow-And-Gray-Modern-Fashion-Blog-Banner-1-2048x1152.png",2048,1152,true],"woocommerce_thumbnail":["https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Yellow-And-Gray-Modern-Fashion-Blog-Banner-1-300x300.png",300,300,true],"woocommerce_single":["https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Yellow-And-Gray-Modern-Fashion-Blog-Banner-1.png",600,338,false],"woocommerce_gallery_thumbnail":["https:\/\/www.mrcoder701.com\/wp-content\/uploads\/2024\/07\/Yellow-And-Gray-Modern-Fashion-Blog-Banner-1-150x150.png",150,150,true]},"rttpg_author":{"display_name":"mr.coder","author_link":"https:\/\/www.mrcoder701.com\/author\/admin\/"},"rttpg_comment":1,"rttpg_category":"<a href=\"https:\/\/www.mrcoder701.com\/category\/nodejs\/\" rel=\"category tag\">NodeJs<\/a> <a href=\"https:\/\/www.mrcoder701.com\/category\/programming\/\" rel=\"category tag\">Programming<\/a>","rttpg_excerpt":"npm stands for Node Package Manager. It's a library and registry for JavaScript software packages. npm also has command-line tools to help you install the different packages and manage their dependencies.","_links":{"self":[{"href":"https:\/\/www.mrcoder701.com\/wp-json\/wp\/v2\/posts\/923","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.mrcoder701.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.mrcoder701.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.mrcoder701.com\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.mrcoder701.com\/wp-json\/wp\/v2\/comments?post=923"}],"version-history":[{"count":2,"href":"https:\/\/www.mrcoder701.com\/wp-json\/wp\/v2\/posts\/923\/revisions"}],"predecessor-version":[{"id":927,"href":"https:\/\/www.mrcoder701.com\/wp-json\/wp\/v2\/posts\/923\/revisions\/927"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.mrcoder701.com\/wp-json\/wp\/v2\/media\/926"}],"wp:attachment":[{"href":"https:\/\/www.mrcoder701.com\/wp-json\/wp\/v2\/media?parent=923"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.mrcoder701.com\/wp-json\/wp\/v2\/categories?post=923"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.mrcoder701.com\/wp-json\/wp\/v2\/tags?post=923"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}