Back to overview

Keeping your dependencies up to date in a visual way using npm-check-updates

The word update spelled out with scrabble blocks
| 2 min read
View count:

Why?

Keeping your dependencies up to date is important because it helps you keep your application secure and up to date with the latest features. It also helps you avoid the situation where you have to update a dependency that is 3 years old and has 100 breaking changes. Using a tool like npm-check-updates helps you keep your dependencies up to date and makes it easier to update them, without having to manually go through all your dependencies in your package.json file.

How?

To install npm-check-updates, run npm install -g npm-check-updates. This will install the tool globally on your machine, making sure you can use the tool in any project. To run the tool, run ncu in the root of your project. This will show you a list of all your dependencies and their current version and the latest version available. The output will look something like this:

Screenshot of NCU command output


Notice in the output that different colors are used to indicate the type of update that is available:

Running ncu -u will output the same list, but with the updated versions of the dependencies. This will also update the dependencies in your package.json & package-lock.json. Now all you have to do afterwards is to run npm install to install the updated dependencies.

Another thing I find useful in this tool is the fact that you can use the —filter flag to filter the dependencies you want to update, for example ncu --filter @babel will only show you the dependencies that start with @babel.

There’s also an option to only go an update ‘patch’ or ‘minor’ versions of your dependencies, this can be done by using the --target flag, for example ncu --target minor will only update your dependencies to the latest minor version.

Of course there’s even more options to use in this tool, you can find them all in the documentation.

Conclusion

If you’re looking for a better workflow of keeping the dependecies of your projects up to date, I would definitely recommend using npm-check-updates. It’s a great tool that helps you keep your dependencies up to date and makes it easier to update them with a visual output.

Did you like this post? Check out my latest blog posts:

Screenshot of an analytics dashboard
16 Jan 2024

Basic analytics with Vercel Postgres - Drizzle - Astro

10 min reading time

  • vercel
  • databases
  • typescript
  • astro
Page of a dictionary
15 Nov 2023

A minimal dependency-free translation system for Next.js

6 min reading time

  • nextjs
  • react
  • javascript
Chrome logo repeated in a grid
4 Sept 2023

Developing a Chrome extension to convert the current url to localhost in 1 click

4 min reading time

  • javascript
  • chrome extension
  • html