Tuesday, 12 March, 2019 UTC


Summary

Keeping npm packages up to date is a chore. Sometimes it can turn into a disastrous chore since updating packages to a new major number could potentially break your apps.
  • Even with the potential for breaking my entire application, I do like staying on the latest version numbers. Danger be damned!
Note: Always go look at the release notes/change log for new versions to check if there are any breaking changes.
Here are 3 tools that can help keep those packages up to date.
Version Lens (VS Code Extension)
Version Lens is an extension that I only learned about recently. It's my favorite tool out of this article since it's the easiest to use.
After installing Version Lens, you'll be able to go into your package.json and see the exact numbers right above each package in dependencies or devDependencies.
Version Lens converts our package.json
We can now see version numbers inline. We can also click to use the specific version.
Here's a gif of it in action:
npm (VS Code Extension)
The npm extension is the package that I used before finding Version Lens. It allows you to hover over a package and see it's latest version. Version Lens simplifies and speeds up that process.
I still have the npm Extension installed but don't really use it to check package numbers anymore.
ncu: npm check updates
The last tool to check for npm package updates is a command line tool.
npm-check-updates allows us to install an npm package and run a command. We can then see the updated packages in our command line.
To install:
npm i -g npm-check-updates
To use:
ncu
We'll get a list of all the dependencies that can be updated:
You can then run ncu -u to update those packages. You can upgrade a single package by typing ncu vue .
This is a little more work than using Version Lens but it is worth noting.
Conclusion
Keeping npm packages up to date is something you should be careful while doing. Make sure you have tests in place to catch any rogue effects that package updates could bring.