神刀安全网

Updating npm packages

The npm cli by itself already offers users a number of different ways to update local and global packages, and for the most part I will focus on working with local packages because that is where I often spend my time; updating and installing them.

npm update

npm update does exactly as you’d expect, give it a package as the argument and it will update, like so:

npm update lodash 

This however, will crucially not update your package.json file, so to do that, add the --save flag (or --save-dev etc), like so:

npm update lodash --save 

This is useful if you know there are updates, but what would do to find out if there were any updates needed?

Updating npm itself

You might not be aware that npm can update itself. Just run npm update -g npm .

npm outdated

npm outdated will check the npm registry to see if any (or, specific) installed packages are currently outdated. Some example output might look like this:

$ npm outdated Package              Current  Wanted  Latest  Location babel-preset-es2015    6.6.0   6.9.0   6.9.0  kickoff cssnano                3.5.2   3.6.2   3.6.2  kickoff eslint                2.10.1  2.10.2  2.10.2  kickoff imagemin-gifsicle      4.2.0   4.2.0   5.0.1  kickoff imagemin-mozjpeg       5.1.0   5.1.0   6.0.0  kickoff imagemin-optipng       4.3.0   4.3.0   5.1.0  kickoff imagemin-pngquant      4.2.2   4.2.2   5.0.0  kickoff imagemin-svgo          4.2.1   4.2.1   5.1.0  kickoff opn                    4.0.1   4.0.2   4.0.2  kickoff 

It is extremely useful at telling you what is out of date but the only way to update each of these packages is to run npm update on them individually or as a group, which isn’t ideal; see below:

npm update babel-preset-es2015 cssnano eslint imagemin-gifsicle imagemin-mozjpeg imagemin-optipng imagemin-pngquant imagemin-svgo opn --save 

You can see I used the --save flag, but what if some were in devDependencies or optionalDependencies ? I would have to run the command a few times with different flags to ensure that my package.json was updated correctly.

More tools to check and update your dependencies

As you can see, while the built-in commands are useful, there’s gotta be a better way. There is/are and below I will show a few of them

david

david is the cli for the popular david-dm service. It offers a very simple cli for checking and updating you dependencies?

  • Install: npm i -g david
  • Run: david
  • Run and update package.json: david update
  • More info: libraries.io/npm/david
$ david devDependencies  ┌───────────────────┬─────────┬────────┐ │ Name              │ Package │ Latest │ ├───────────────────┼─────────┼────────┤ │ imagemin-optipng  │ 4.3.0   │ 5.1.0  │ ├───────────────────┼─────────┼────────┤ │ imagemin-pngquant │ 4.2.2   │ 5.0.0  │ ├───────────────────┼─────────┼────────┤ │ imagemin-mozjpeg  │ 5.1.0   │ 6.0.0  │ ├───────────────────┼─────────┼────────┤ │ imagemin-gifsicle │ 4.2.0   │ 5.0.1  │ ├───────────────────┼─────────┼────────┤ │ imagemin-svgo     │ 4.2.1   │ 5.1.0  │ └───────────────────┴─────────┴────────┘  npm install --save-dev imagemin-optipng@5.1.0 imagemin-pngquant@5.0.0 imagemin-mozjpeg@6.0.0 imagemin-gifsicle@5.0.1 imagemin-svgo@5.1.0 

npm-check-updates

npm-check-updates is a command-line tool that allows you to upgrade your package.json or bower.json dependencies to the latest versions, regardless of existing version constraints.

npm-check-updates maintains your existing semantic versioning policies, i.e., it will upgrade your "express": "^4.11.2" dependency to "express": "^5.0.0" when express 5.0.0 is released.

$ ncu   imagemin-gifsicle  4.2.0  →  5.0.1  imagemin-mozjpeg   5.1.0  →  6.0.0  imagemin-optipng   4.3.0  →  5.1.0  imagemin-pngquant  4.2.2  →  5.0.0  imagemin-svgo      4.2.1  →  5.1.0  The following dependencies are satisfied by their declared version range, but the installed versions are behind. You can install the latest versions without modifying your package file by using npm update. If you want to update the dependencies in your package file anyway, use -a/--upgradeAll.   babel-preset-es2015  ^6.3.13  →   ^6.9.0  cssnano               ^3.5.2  →   ^3.6.2  eslint               ^2.10.0  →  ^2.10.2  opn                   ^4.0.1  →   ^4.0.2  Run with -u to upgrade package.json 

npm-dview

npm-dview is a command line tool for comparing a package.json file’s dependency version numbers with the latest remote version number. It compares both “dependencies” and/or “devDependencies”.

  • Install: npm i -g npm-dview
  • Run: npm-dview
  • Run and update package.json: npm-dview --update
  • More info: libraries.io/npm/npm-dview
$ npm-dview Processing: /Users/mrmartineau/htdocs/trykickoff/kickoff/package.json Processing: dependencies 3 of 3 [===] 100% 0.2s   Processing: devDependencies 22 of 22 [======================] 100% 0.9s    Regular Dependencies ┌───────────────────────────┬──────────────────┬────────┬────────┬──────────┐ │ Module Name               │ Requested        │ Local  │ Remote │ Current? │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ console                   │ ^0.5.2           │ 0.5.2  │ 0.5.2  │ ✓        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ double-dollar             │ ^1.0.0           │ 1.0.0  │ 1.0.0  │ ✓        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ lite-ready                │ ^1.0.4           │ 1.0.4  │ 1.0.4  │ ✓        │ └───────────────────────────┴──────────────────┴────────┴────────┴──────────┘  Dev Dependencies ┌───────────────────────────┬──────────────────┬────────┬────────┬──────────┐ │ Module Name               │ Requested        │ Local  │ Remote │ Current? │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ autoprefixer              │ ^6.3.6           │ 6.3.6  │ 6.3.6  │ ✓        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ babel-plugin-transform-o… │ ^6.8.0           │ 6.8.0  │ 6.8.0  │ ✓        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ babel-preset-es2015       │ ^6.3.13          │ 6.6.0  │ 6.9.0  │ ✖        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ babelify                  │ ^7.3.0           │ 7.3.0  │ 7.3.0  │ ✓        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ cssnano                   │ ^3.5.2           │ 3.5.2  │ 3.6.2  │ ✖        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ grunt                     │ ^1.0.1           │ 1.0.1  │ 1.0.1  │ ✓        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ grunt-browserify          │ ^5.0.0           │ 5.0.0  │ 5.0.0  │ ✓        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ grunt-contrib-clean       │ ^1.0.0           │ 1.0.0  │ 1.0.0  │ ✓        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ grunt-contrib-copy        │ ^1.0.0           │ 1.0.0  │ 1.0.0  │ ✓        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ grunt-contrib-imagemin    │ ^1.0.0           │ 1.0.0  │ 1.0.0  │ ✓        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ grunt-newer               │ ^1.2.0           │ 1.2.0  │ 1.2.0  │ ✓        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ grunt-shimly              │ ^1.0.2           │ 1.0.2  │ 1.0.2  │ ✓        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ imagemin-gifsicle         │ 4.2.0            │ 4.2.0  │ 5.0.1  │ ✖        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ imagemin-mozjpeg          │ 5.1.0            │ 5.1.0  │ 6.0.0  │ ✖        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ imagemin-optipng          │ 4.3.0            │ 4.3.0  │ 5.1.0  │ ✖        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ imagemin-pngquant         │ 4.2.2            │ 4.2.2  │ 5.0.0  │ ✖        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ imagemin-svgo             │ 4.2.1            │ 4.2.1  │ 5.1.0  │ ✖        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ load-grunt-configs        │ ^1.0.0           │ 1.0.0  │ 1.0.0  │ ✓        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ load-grunt-tasks          │ ^3.5.0           │ 3.5.0  │ 3.5.0  │ ✓        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ minifyify                 │ ^7.3.3           │ 7.3.3  │ 7.3.3  │ ✓        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ postscss                  │ ^1.4.1           │ 1.4.1  │ 1.4.1  │ ✓        │ ├───────────────────────────┼──────────────────┼────────┼────────┼──────────┤ │ time-grunt                │ ^1.3.0           │ 1.3.0  │ 1.3.0  │ ✓        │ └───────────────────────────┴──────────────────┴────────┴────────┴──────────┘  Peer Dependencies ┌────────────────────────────────────────────────┐ │ Warning                                        │ ├────────────────────────────────────────────────┤ │ No dependencies found in the package.json file │ └────────────────────────────────────────────────┘ 

npm-check

npm-check is very similar to the others in this category, with one exception: it has an interactive interface that allows you to choose which packages you want updated. This is extremely useful if you don’t want to update some packages for example. It can also be used on global packages too/

  • Install: npm i -g npm-check
  • Run: npm-check
  • Run and update package.json: npm-check -u This presents an interactive package update chooser. Use npm-check -g -u
  • More info: libraries.io/npm/npm-check
$ npm-check -u ? Choose which packages to update.   Minor Update New backwards-compatible features.  ◯ babel-preset-es2015 devDep  6.6.0  ❯  6.9.0  https://babeljs.io/  ◯ cssnano devDep              3.5.2  ❯  3.6.2  https://github.com/ben-eb/cssnano   Major Update Potentially breaking API changes. Use caution.  ◯ imagemin-gifsicle devDep  4.2.0  ❯  5.0.1  https://github.com/imagemin/imagemin-gifsicle#readme  ◯ imagemin-mozjpeg devDep   5.1.0  ❯  6.0.0  https://github.com/imagemin/imagemin-mozjpeg#readme  ◯ imagemin-optipng devDep   4.3.0  ❯  5.1.0  https://github.com/imagemin/imagemin-optipng#readme  ◯ imagemin-pngquant devDep  4.2.2  ❯  5.0.0  https://github.com/imagemin/imagemin-pngquant#readme  ◯ imagemin-svgo devDep      4.2.1  ❯  5.1.0  https://github.com/imagemin/imagemin-svgo#readme   Space to select. Enter to start upgrading. Control-C to cancel. 

Is there another way?

Yes there is. A service called Greenkeeper.io , which tracks your dependencies and applies an update to a branch for every new version coming in. Your test suite runs behind the scenes, and only if a dependency update breaks your software, we let you know in a Pull Request, including all the information you need to make an informed decision.

By the way, it only works with Github so if you use any other service, you’re out of luck.

Fin

If you work on an open-source Github repo, Greenkeeper.io is a brilliant choice. It is free for public repos and 1 private repo, and very affordable if you have more private repos. We use it on Kickoff and it is brilliant.

For all other use cases, I recommend npm-check . The interactive tool is so useful, it not only shows you which packages need updating but provides more information about the package too.

If I have missed any others, please let me know on Twitter .

It is also worth noting that you might not want to update your dependencies. This is a much more tricky subject that is best left for another post, but if you’re interested right now, I recommend reading Nicolás Bevacqua’s post on the subject

转载本站任何文章请注明:转载至神刀安全网,谢谢神刀安全网 » Updating npm packages

分享到:更多 ()

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址