How to find outdated packages in npm?

NPM as a package manager has been a very useful tool in web development. Using npm has made it very convenient for us to add various packages to our web development projects. However, like with other software, our npm packages too get outdated either because a new feature has been introduced, the code has been optimized, or because some security fixes have been released. Nonetheless, it becomes important to find outdated packages in npm and to either remove them or update them like we would find unused dependencies in npm and remove them too to keep our build optimized.

How do I check for outdated npm packages?

Checking for outdated packages in npm is not a difficult task. You can run the following command to find outdated packages in npm :

npm outdated

The above command is inbuilt and you do not have to install any additional packages for it. Running the npm outdated command would list out all the outdated packages along with their latest version number. Following is an example of the command I ran on a trial app that I have:

D:\Project>npm outdated
Package    Current  Wanted  Latest  Location
bootstrap    5.0.0   5.0.1   5.1.1  MyApp

When we run the npm outdated command, we get to see the name of the package that is outdated with few other data which are as follows:

• Package: This is the name of the package that is outdated
• Current: This is the version number of the package that is currently installed, i.e the outdated package
• Wanted: This is the highest version of the package that satisfies the semver range defined in the package.json file.
• Latest: This is the latest version number of the package that is available to download.
• Location: This is the name of the app as defined in the package.json.

What is the difference between Wanted vs Latest in npm outdated command?

Well, one can easily get confused between the wanted vs latest when running the npm outdated command.

The Wanted version basically is the highest version of the package that can be fetched as per your package.json declaration. Whereas, the Latest version is the latest or the newest version of the package available on npm’s registry for download. For example. let’s say that I’ve bootstrap’s version 5.0.0 installed on my machine. But in my package.json file, I have declared to install the exact version number 5.0.1, like the following:

"dependencies": {
  "bootstrap": "5.0.1"
    
}

In such a case when I run npm outdated command, the wanted version would be 5.0.1, because I’ve explicitly declared in my package.json that I want version 5.0.1 of bootstrap to be installed and nothing else. However, the latest version would still be 5.1.1, because as per the npm registry information, the latest version available is 5.1.1 (at the time I wrote this). In other words, the Wanted version is bound by the declaration in package.json. It can only go until the range that is permitted as per the package.json declaration either by giving the exact version or by using ~ (tilde) or ^ (caret) sign before the version number.

Hope the Wanted vs Latest in npm outdated command is clear now. Let us know in the comments if you have any doubts.

What does the Color codes mean in NPM Outdated command?

You might also notice while running the command that the package name might be in red or yellow.

A red color indicates that there is a newer version matching your semver requirement and you should update now.

A yellow color indicates that there is a newer version above your semver range requirements and hence you need to be careful while updating.

Well, I believe it was an easy task to find outdated packages in npm using the simple npm outdated command. It is very important that we find outdated packages and update outdated npm packages so that we don’t run into security issues or other errors. Equally important is to find unused dependencies in npm and to remove these unused dependencies to keep your build sizes optimized.