Update all installed npm packages to the latest version

Posted on Jun 06, 2022

Learn how you can update all npm packages installed for your project

When you run the npm install command from the terminal, npm will install the package you stated next to the install keyword, and list that package inside the package.json file.

For example, suppose you install Lodash as a helper library for your project:

npm install lodash

The package lodash will be installed in your node_modules/ folder, and the package.json file will have a new line under the dependencies object:

{
  "dependencies": {
    "lodash": "^3.5.0"
  }
}

The npm install command always install the latest version of the package you defined.

You can see the exact version installed for your project using the npm list command:

$ npm list   
n-app@1.0.0
└── lodash@3.5.0

Since npm packages frequently release a new version, at some time in the future you may need to update your package.

To see a list of outdated packages in your project, use the npm outdated command.

Here’s the example output:

$ npm outdated
Package  Current  Wanted   Latest  Location             Depended by
lodash     3.5.0  3.10.1  4.17.21  node_modules/lodash  n-app

As you can see, the outdated command has the Current version installed, the Wanted version, and the Latest defined.

npm package versioning follows the semantic versioning (semver) rule, in which a package has a major.minor.patch version:

A patch update adds backward compatible bug fixes. A minor version update adds backward compatible new features.

A major version update introduces changes that break compatibility with the previous version.

The Wanted version is the latest stable major version as the one defined in your package.json file.

The Latest version is the most updated stable version. Note that the latest version with a different major version will introduce breaking changes.

To update your package to the latest Wanted version, you can run the npm update command:

$ npm update
$ npm list
n-app@1.0.0
└── lodash@3.10.1

As you can see, the version of lodash changed from 3.5.0 to 3.10.1.

The npm update command also works when you have multiple packages. If you want to update only a single package, you need to specify the command as npm update <package name>.

How to update packages to the latest version

The npm update command follows the dependencies rule you specified in your package.json file.

By default, there’s a caret symbol added in your dependencies rule like the example Lodash package above (^3.5.0)

The caret symbol means you are only allowed to update the package to the latest minor version.

There’s also the tilde symbol (~) which means you are allowed to update to the latest patch version.

To update packages to the latest version, you need to use the npm install <package>@latest command.

Suppose you have the following output when running npm outdated:

As there are several packages that have new major versions in the output above, you need to update the packages using the npm install command as follows:

npm install lodash@latest
npm install cross-env@latest
npm install date-fns@latest
npm install typescript@latest

Keep in mind as these packages introduce a new major version, most likely there are breaking changes from the previous version.

The recommended strategy is to update just one package at a time, then test if your application is running without any issue.

Update using the npm-check-updates package (dangerous)

There’s a package named npm-check-updates used for checking on your package.json file and see if there’s a newer version available from the npm registry.

This package also helps you overwrite the versions listed as dependencies in your package.json file.

First, you install npm-check-updates globally:

npm install -g npm-check-updates

Then you run the ncu -u command from the root directory of your project.

Here’s an example output on the command line:

The following dependencies object:

{
    "dependencies": {
    "cross-env": "^5.2.1",
    "date-fns": "^1.26.0",
    "lodash": "^3.5.0",
    "typescript": "^3.7.2"
  }
}

Will be updated as follows. Notice the different versions defined for each package:

{
  "dependencies": {
    "cross-env": "^7.0.3",
    "date-fns": "^2.28.0",
    "lodash": "^4.17.21",
    "typescript": "^4.7.3"
  }
}

Once done, you need to run npm install to get the latest versions. I don’t recommend you to use npm-check-updates, however.

This is because updating the major version of multiple packages at once could break your application.

The reason why npm update follows the semantic rules is to help you transition any package update gracefully, letting you inspect the application for any issue.

The safer way to update major package versions is to use the npm install <package>@latest command.

Update one package, then check if the update causes any issue.

Once you’re certain the application is running fine, update another package. Repeat this until all packages are updated to the latest major version.

But of course, you are free to run ncu -u if you want to. Make sure you back up the dependencies list before you do, though.

And that’s how you update all npm packages installed as dependencies on your project. 😉

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.