Introduction to npm

npm is the standard package manager for Node.js.

There are many things that npm does. It allows for seamless node.js package management. You can install, share and manage node.js packages.

npm consists of three components:

In the npm official Website you can find packages, view documentation, share and publish packages.

The npm Registry is a large database consisting of packages. In September 2019 over 1 million packages were reported being listed in the registry, making npm the biggest single language code repository! and you can be sure there is a package for (almost!) everything. 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.

The CLI is the command line that helps in interacting with the npm for installing, updating and uninstalling packages and also managing dependencies.

Note: Yarn is an alternative to npm. Make sure you check it out as well.

Installation

npm comes with Node.js, this means you don’t have to install it separately. Go to the official website to Download Node.js and install it, if you haven’t already installed it on your system.

After installing node, You can check the version of node and npm by running

node --version
npm --version

package.json

The package.json is the project manifest file. Using the package.json you can manage dependencies and write scripts. It has all the meta data about the project.

Init Project

Note: you only need to do this if you are starting a new project, if not take a look if the package.json file already exist

For create a package.json, first head over to your project folder. You can create package.json by running the command

npm init

It asks you for some data like package name, description, version, author, license, etc. You can just press enter for defaults.

Or to quickly create a package.json file. You can use the command

npm init -y

Installing all dependencies

If the project has a packages.json file, by running the command

npm install

it will install all the dependencies that the project needs, that is to say, the packages from the dependencies and devDependencies at the package.json, in the node_modules folder, creating it if it doesn’t already exist.

The node_modules is the folder in which our local packages are installed. There will be a new file named package-lock.json. This file contains the exact version of the package, unlike package.json which contains the semantic version.

Installing a single package

You can also install a specific package by running

npm install <package-name>

Often you’ll see more flags added to this command:

--save installs and adds the entry to the package.json file dependencies (default as of npm 5)
--save-dev installs and adds the entry to the package.json file devDependencies
--no-save installs but not doesn’t add the dependency to your package.json file.

The difference is mainly that devDependencies are usually development tools, like a testing library, while dependencies are bundled with the app in production.

Installing a single package Globally

A globally installed packages works anywhere on the machine. To install global packages you’ve to use -g flag.

Generally, any packages you use in your project have to be installed locally. And packages you use in the command line are to be installed globally.

The command for the local and global packages are same except that you have to use -g flag for global packages.

For example you can install nodemon globally, that is a utility that will monitor for any changes in your source code and automatically restart your server, it’s great idea for development

npm install -g nodemon

Versioning

In addition to plain downloads, npm also manages versioning, so you can specify any version of a package, or require a version higher or lower than what you need.

Maybe you could find that a library is only compatible with a major release of another library. Or a bug in the latest release of a lib, still unfixed, is causing an issue.

Specifying an explicit version of a library also helps to keep everyone on the same version of a package, so that the whole team runs the same version until the package.json file is updated.

In all those cases, versioning helps a lot, and npm follows the semantic versioning (semver) standard.

All the package versions are represented with three digits

The first digit is major
The second is minor
The third is patch.

The patch(~) is updated for bug fixes.

The minor(^) is updated for every new functionality that doesn’t break the existing code.

The major is updated for big changes. These generally break the existing code.

In the package.json, when you install a package, you will see a caret^ symbol by default. This indicates that when a user is downloading your project, the package will be updated to the latest minor version. Same applies to patch. If we don’t include any symbol then exact version is downloaded. To get the latest major version, asterisk * is used. But you don’t want to do this as the major version can break your code.

To install either major, minor, patch (or) exact version, you can use the command

npm install <package-name>@x.y.x

For example, let’s install lodash

There are several ways to accomplish this. First, let’s start with the basic

npm install lodash

This command installs lodash and fetches the latest available version.

If you know the exact version of the package that you need, you can append it to the package name after the @ character

npm install lodash@4.17.4

If you don’t know the exact version of the package, npm also allows using semantic ranges to define the version

npm install lodash@^4.0.0

This command will install the latest 4.x.x version.

Both examples don’t modify package.json and don’t add installed modules to the list of dependencies. We must use --save to add the installed module to the package.json dependencies and --save-dev to add it to devDependencies.

If you install a module without defining a specific version, npm will add the semantic range to the package.json as is. To prevent this, use --save-exact flag in addition to --save or --save-dev. This flag will force npm to store the exact module version in the package.json.

Updating packages

Since we have installed packages sometimes we need to update our packages to get new features. To do that, you’ve to run

npm update

npm will check and update all the packages listed to the latest version that satisfies your versioning constraints.

Updating a single package

For update a single package you can specify it to update as well

npm update <package-name>

Uninstall a single package

Sometimes you don’t need a particular package and you want to remove it. It’s not a good idea to manually remove the package from the node_modules folder as it can be a dependency for the other packages. To safely uninstall a package you’ve to run

npm uninstall <package-name>

This will completely remove everything npm installed on its behalf.

You must use the corresponding flag to save the changes in the package.json.

For example if you want to uninstall lodash from the dependencies of package.json you should run

npm uninstall lodash --save

Or from the devDependencies

npm uninstall lodash --save-dev

List installed packages

To get the list of installed packages, run the command

npm run list

This will list all the packages including its dependencies. The packages installed by you will be in the depth 0. Its dependencies will be in the depth 1 and further dependencies will be in the depth 2 and so on. To get packages of a certain depth, use the command

npm list depth <number>

Running Tasks

The package.json file supports a format for specifying command line tasks that can be run by using

npm run <task-name>

For example:

{
  "scripts": {
    "start-dev": "node lib/server-development",
    "start": "node lib/server-production"
  },
}

It’s very common to use this feature to run Webpack:

{
  "scripts": {
    "watch": "webpack --watch --progress --colors --config webpack.conf.js",
    "dev": "webpack --progress --colors --config webpack.conf.js",
    "prod": "NODE_ENV=production webpack -p --config webpack.conf.js",
  },
}

So instead of typing those long commands, which are easy to forget or mistype, you can run

npm run watch
npm run dev
npm run prod

Getting Help

npm CLI has built -n help command. You can access it by

npm help

To get help for a particular command run

npm <command> -h

You can also search npm documentation for help. To do that use

npm help-search <command>

Now you’ve learned all the basics of npm. To know more about npm you can go to the documentation in the official Website. Now you can start using it in your own projects, happy hacking!

Thanks for reading! ❤

If you liked this post, please do share/like it with all of your programming buddies!

#npm #node-js #javascript