What you need to know about npm

Posted on Dec 28, 2018

Let's learn about npm here.

npm stands for Node Package Manager, and it is one of the most used web developer tool for installing, sharing and managing a Node.js package. npm comes installed with Node, so you have to install Node first.

You can check the version of installed Node and npm with the following command line:

$ node -v
$ npm -v

Creating a Node project

First, make an empty directory for a new project called myapp, and inside that directory type npm init. The Terminal will ask for more information such as author name, description, url and etc. You can just press enter for defaults, or type npm init -y.

Now this directory is technically a Node Project directory. You can start installing packages you need for this project.

Installing package for a project

Also known as local install, this type of install will make the package available to import or require from your project directory. For an example, let’s install expressJS

$ npm install express

Now a new directory named node_modules and package-lock.json file is auto-generated . The content of package.json is also updated with a new dependency

"dependencies": {
  "express": "^4.16.4"

Then create an app.js file with the following content.

const express = require('express');
const app = express();
const port = 3000;

app.get('/', (req, res) => res.send('Hello World!'));

app.listen(port, () => console.log(`Example app listening on port ${port}!`));

Now run a node server in the Terminal.

$ node app.js

Your program will run just fine and the require won’t throw any errors, because our Node server found express module in the local node_modules directory. Open your browser and navigate to localhost:3000

Removing a local package

Stop your node server, then try removing the express package by typing the following command

$ npm remove express

Then run $ node app.js again. An error message will appear saying “Cannot find module ‘express’”.

Global package

Global packages are package that you can access from anywhere, and used to run Node package directly from the Terminal. A global package will not be added to your local project package.json list of dependencies. An example of global package is Gulp, which is used to run task from the command line. You have to install a global gulp-cli and a local gulp package in order to use it. In order to install a package globally, just add a -g or --global prefix.

$ npm install -g gulp-cli

Now you can run gulp --version command from the Terminal.

$ gulp --version
[14:23:58] CLI version 2.0.1

To uninstall a global package, add the same -g prefix as well.

$ npm remove -g gulp-cli

npm package version

An npm is technically a software, and as all software in the world it will be updated and patched for new features and bugfixes. An npm package use a structured semantic versioning of a symbol and three numbers. We already have an example with the express dependency above.

"dependencies": {
  "express": "^4.16.4"

The first number above (4) is known as major version number, and it represents an update that can break code from previous versions. The second number 16 is a minor version number, and it represents an update for new functionality or feature that does not break the code. The last number, the patch version number represents small updates for bugfixes or security patch.

In the dependency above, we can also see a caret symbol (^). This indicates that npm will download the latest minor version for our project. This is added by default when we run npm install. There is also a tilde symbol (~) that is used for downloading the latest patch version of the project.

We can install a specific version of a package by using an @ symbol.

Type all three numbers for an exact version

npm install express@4.15.1

Type the first two numbers for the latest patch version.

npm install express@4.15

And type only the first number for the latest major version

npm install express@3

As a package manager, npm does fulfill it’s role as a keeper of dependencies and registry. It is the default package manager for modern JavaScript projects. You can learn more from its documentation at https://docs.npmjs.com/

Level up your programming skills

I'm sending out an occasional email with the latest programming tutorials. Drop your email in the box below and I'll send new stuff straight into your inbox!

No spam. Unsubscribe anytime.