Actually update npm packages to their latest versions

  • — Frontend

  • — 1 min. read

  • — 12/31/2022

A cluttered mess of boxes at a grocery store
Packages... packages everywhere 😖. Photo by CHUTTERSNAP / Unsplash

So the other day I was working on updating packages for our repo over at Bitfo and just like a standard NodeJS developer would do, I ran the following command:

npm outdated

It spit out a list of packages to update, all fine all good.

I then ran:

npm update

Packages got updated except... they weren't at their latest version. That got me curious, why doesn't npm update actually update packages to their latest versions?

Turns out the answer was trivial (and also kinda dumb). You see, npm outdated / npm update only updated packages according to SemVer, just to recap what that is:

Semantic versioning (or "SemVer") is a convention for versioning packages. It looks like this: vX.Y.Z, where X is the major release number, Y is the minor release number, and Z is just a "patch" number.

When you run npm update, it only updates to the most recent the minor/patch version of a package, I guess this is to prevent accidental breaks from upgrading to major release versions. However, what if we do want to update to the latest major version?

I did some extra digging, and it turns out the recommended way to do this is to reinstall the package with npm install. That's fine, but what if we need to do multiple package updates?

✨ Introducing npm-check-updates.

Use npm-check-updates to update your packages

npm-check-updates is a npm package that does exactly what you think it does, it checks for updates just like npm outdated does. The only difference between the two is npm-check-updates actually updates your packages to their latest versions.

To update your packages to their latest versions, run:

npx npm-check-updates

This will spit out a lit of packages to update.

You can then run

npx npm-check-updates -u

To upgrade your packages to their latest versions.

And there you have it, you've just updated all your packages to their most recent versions đŸ“Ļ.

Just make sure you didn't unintentionally break something when you upgraded 😅.

Shaun Chander

hey (again), I'm shaun

I'm posting 3 tips on creative web development daily. Subscribe below to to get tips delivered straight into your inbox!