|
| 1 | +# How to update NPM packages |
| 2 | + |
| 3 | +It’s important to update your packages to get new features, bug fixes, and security patches. [NPM Check Updates](https://www.npmjs.com/package/npm-check-updates) is a CLI that will help you safely make those updates. |
| 4 | + |
| 5 | +## Install npm-check-updates |
| 6 | +```sh |
| 7 | +npm i -D npm-check-updates |
| 8 | +``` |
| 9 | + |
| 10 | +## See a list of packages that can be updated |
| 11 | +NPM packages follow [semantic versioning](https://semver.org). This command will show you which packages can be updated and which major, minor, or patch versions are available. |
| 12 | + |
| 13 | +```sh |
| 14 | +npx ncu |
| 15 | +``` |
| 16 | + |
| 17 | +Notice the colors: |
| 18 | +- Green = (nonmajor version zero) patch updates |
| 19 | +- Cyan = minor updates |
| 20 | +- Red = major or [version zero (0.y.z)](https://semver.org/#spec-item-4) updates |
| 21 | + |
| 22 | +## Update green patch versions first, all at once |
| 23 | + |
| 24 | +Since green patch version updates are meant for backward-compatible bug fixes, it's ok to update them all at once. |
| 25 | + |
| 26 | +```sh |
| 27 | +npx ncu -u -filter <package-with-green-patch-update> |
| 28 | +npx ncu -u -filter <package-with-green-patch-update> |
| 29 | +npx ncu -u -filter <package-with-green-patch-update> |
| 30 | +... |
| 31 | +npm i |
| 32 | +``` |
| 33 | + |
| 34 | +> Note: `npx ncu -u -t patch` updates all patch versions, including major version zero patch versions, which can break your code. If all your patch updates are green, feel free to use this command instead to update them all at once. |
| 35 | +
|
| 36 | +Assuming package maintainers follow semantic versioning, updating patch versions shouldn't break anything, but it's good practice to re-run your tests before committing these changes. |
| 37 | + |
| 38 | +```sh |
| 39 | +npm run test |
| 40 | +``` |
| 41 | + |
| 42 | +If all tests pass, commit your changes. |
| 43 | + |
| 44 | +```sh |
| 45 | +git add . |
| 46 | +git commit -m "Updated patch versions" |
| 47 | +``` |
| 48 | + |
| 49 | +## Update cyan minor versions second, one by one |
| 50 | + |
| 51 | +Minor version updates introduce new features in a backward-compatible way. This is exciting and it's good practice to take some time to explore the new functionality and apply relevant updates to your code base or plan to apply them later. It's recommended you do this package by package instead of all at once. |
| 52 | + |
| 53 | +To check for the new package's features, check its release notes on GitHub. |
| 54 | + |
| 55 | +> If you haven't updated a fairly active package in a while, reading all its release notes can take some time. Take into consideration how important a package is for your project when choosing which to update first. |
| 56 | +
|
| 57 | +```sh |
| 58 | +npx ncu -u -filter <package-with-cyan-minor-update> |
| 59 | +npm i |
| 60 | +``` |
| 61 | + |
| 62 | +Again, assuming package maintainers follow semantic versioning updating patch versions shouldn't break anything, but it's good practice to re-run your tests to make sure. |
| 63 | + |
| 64 | +```sh |
| 65 | +npm run test |
| 66 | +``` |
| 67 | + |
| 68 | +If all tests pass, commit your changes. |
| 69 | + |
| 70 | +```sh |
| 71 | +git add . |
| 72 | +git commit -m "Updated minor versions" |
| 73 | +``` |
| 74 | + |
| 75 | +## Update red versions third, one by one |
| 76 | + |
| 77 | +Red updates can happen on patch or minor versions (for zero major version (0.y.z) packages) or major versions. Either way, they could be breaking changes. It's recommended you read its release notes to see what changed and plan accordingly. |
| 78 | + |
| 79 | +> Again, you might want to take into consideration how important a package is for your project when choosing which to update first. |
| 80 | +
|
| 81 | +```sh |
| 82 | +npx ncu -u -f <package-with-red-version-update> |
| 83 | +npm i |
| 84 | +``` |
| 85 | + |
| 86 | +Make sure you've made all relevant changes and that the tests pass. |
| 87 | + |
| 88 | +```sh |
| 89 | +npm run test |
| 90 | +``` |
| 91 | + |
| 92 | +If all tests pass, commit your changes. |
| 93 | + |
| 94 | +```sh |
| 95 | +git add . |
| 96 | +git commit -m "Updated <package-with-red-version-update> patch/minot/major version" |
| 97 | +``` |
0 commit comments