The Complete Guide To Npm

Published in

Analytics Vidhya

5 min readMay 25, 2020

Npm (Node package manager) is the standard package manager of the Node.js ecosystem. It’s the most extensive online package repository, containing over one-million packages. Also, it’s a command-line interface tool used by developers to manage their Node.js projects. Developers all around the world use npm to share their software. React, Vue, Express, and Angular are some great examples.

Npm for dummies

This section is for explaining npm using analogies. You can skip if you understand the concept of software packages.

Let’s say that you want to build a laptop. Would you create the CPU, RAM, screen, software, cameras, by yourself? No. You would probably order most of the parts from different manufacturers (Snapdragon, AMD, Intel, etc.). Instead of creating everything from scratch, you use various components made by separate entities. This is essentially the goal of software packages. There is no need for every back-end developer to create a framework to handle HTTP requests; indeed, most developers use existing frameworks like Express, Fastify, Meteor, etc.

Real-life example

Gatsby (static React site generator) depends on Express.

Express depends on cookie.

Cookie doesn’t depend on any library (uses plain javascript).

Stats

Npm is used tremendously by the community. The graph below depicts the number of downloads every day in the past two years for the most popular web frameworks.

package.json

A standard Node.js project contains a file called package.json. It is a JSON manifest file which holds all of the relevant data to the app. Just like the manager of a restaurant who holds information about the restaurant, the workers, and the different vendors.

Here is how a short basic package.json looks like:

"name": "vreangular", // see what I did there?
"version": "0.0.1",
"description": "",
"author": "Evan Boo",
"license": "MIT",
"dependencies: {...},
"devDependencies: {...},
"scripts": {...},

name, author, license, description — Important if you want to publish your repository.

Version — If you are maintaining an open-source npm package, you should update it according to the semantic conventions. 3.7.2– 3 is the major version, 7 is the minor version, and 2 is the patch.

scripts

Here we put out project’s scripts: building, testing, linting, deploying, etc. Each project can have custom-made scripts adapted for a unique use-case. Custom scripts can be added and used by developers to enhance development capabilities. For example, executing end-to-end tests in a specific directory.

"scripts": {
  "prebuild": "rimraf dist",
  "build": "nest build",
  "start": "nest start",
  "lint": "tslint -p tsconfig.json -c tslint.json",
  "test": "jest",
}

dependencies

Required for building the project. They are specified in a simple object that maps a package name to a version range. The version range is a string that complies with a specific syntax.

"dependencies": {
  "@hapi/joi": "^17.1.1",
  "@nestjs/common": "^7.0.7",
  "@nestjs/config": "^0.4.0",
  "@nestjs/core": "^7.0.7"
}

devDependencies

The dependencies needed only for the development of the project but not for building it. For example, testing frameworks are not bundled into the final code build but are used only in development.

"devDependencies": {
  "@nestjs/cli": "^7.1.2",
  "@nestjs/schematics": "^7.0.0",
  "@nestjs/testing": "^7.0.7",
  "@types/express": "^4.17.4"
}

package-lock.json

package-lock.json is generated automatically for any operations where npm modifies either the node_modules tree, or package.json. It describes the exact tree that was generated, such that subsequent installs can generate identical trees. This is used to save an exact copy of the packages to ensure that the program works the same on different machines.

This file is intended to be committed into source repositories, and serves various purposes:

Describe a single representation of a dependency tree such that teammates, deployments, and continuous integration are guaranteed to install the same dependencies.
Keeps the exact state of node_modules in the project without the need to commit the whole node_modules folder into the source control.

node_modules

When you run npm install, npm installs the required packages into your project root directory in a folder called node_modules. The folder's size is usually above 150Mb for large projects, and it's a major headache for developers who have many projects.

npm can install packages in local or global mode. If the flag -g is used, npm installs the package into the current user’s root directory. To find globally installed npm modules in windows, open the windows search, and type %appdata%. There is a folder named npm — the global packages reside there.

When installing packages globally, we install them per user and not per project. There are cases when this is not advised, such as working on multiple projects with different versions of the same package — for example, working with Angular 5 and Angular 9.

Npm commands

Installing project dependencies

npm can install all the dependencies of a project in a single command. This command is usually used when we clone a new project.

npm install

The script will always install dependencies according to the current package.json. If the specifications change and you run the command again, it will install packages according to the new specifications.

Executing a script

npm run script_name where the script name is defined in the package.json (build, test:e2e, etc.).

Installing a dev dependency

npm install jest -D -D saves the package as a dev dependency and doesn't bundle it in the build.

List global packages

Shows us all of the global packages for the current user.
npm list --global

Yarn

We can’t talk about npm without mentioning Yarn. Yarn is an alternative client created by Facebook engineers. It is important to note that Yarn is not a different repository for storing node packages, but a different client to handle the work with the repository.

Conclusion

Whoo! We covered many concepts today. Quick recap:

Npm is mainly a repository containing Node.js projects.
Packages are useful for building reusable code and sharing code.
package.json is the manifest of a node.js project.
package-lock.json stores the exact package versions.
node_modules is the folder containing all of the dependencies of the project
Yarn is an alternative client built by Facebook engineers to work with Node.js packages.

Thank you for reading!