npmでインストールされているパッケージを、npm-check-updatesでまとめてアップデートする方法

npmでインストールされているパッケージを、npm-check-updatesでまとめてアップデートする方法

package.jsonに記載されているパッケージをアップデートしようと思ったとき、使用しているパッケージがひとつふたつならともかく、それらが数十個とかになってくるとそれぞれ行っていくのは面倒です。
その際に便利なのが「npm-check-updates」というパッケージで、これを使用することで簡単に各パッケージの更新情報の確認やpackage.jsonの更新を行うことができます。

npm-check-updatesのインストール

まずは「npm-check-updates」をインストールします。
今回はグローバルにインストールするのでコマンドに下記を入力します。

$ npm install -g npm-check-updates

使い方 - バージョン確認

「npm-check-updates」がインストールできたら、任意のプロジェクト(ディレクトリ)で下記コマンドを入力します。

$ ncu

$ npm-check-updatesでも可。

すると$ npm outdatedの簡易版のような見栄えで各パッケージの現在インストールされているバージョンと最新バージョンの情報がそれぞれ一覧表示されるのを確認できます。
下記はサンプルとして古いバージョンの「autoprefixer」と「postcss」をインストールした状態で行った場合の表示で、例えば「postcss」であれば現在v5.1.0がインストールされており、最新版は6.0.8があるということになります。

$ ncu
Using /Users/example/package.json
⸨░░░░░░░░░░░░░░░░░░⸩ ⠹ :
 autoprefixer  ^6.4.0  →  ^7.1.2
 postcss       ^5.1.0  →  ^6.0.8

使い方 - package.jsonの更新

先ほどのコマンドでバージョンを確認することはできましたが、これだけではまだpackage.jsonは更新されていません。
バージョン確認だけでなくpackage.jsonをアップデートする場合は下記のように-uを付けてコマンドを入力します。

$ ncu -u

上記コマンドを入力後package.jsonを確認すれば、それぞれ最新のバージョンに書き換えられているのを確認できると思います、

パッケージのアップデート

あとは、実際のパッケージをアップデートする(上ではpackage.jsonが更新されただけ)ために下記コマンドを入力します。
入力後にバージョンアップされているかどうかは$ npm ls --depth=0などで確認できると思います。

$ npm update

その他の使い方

特定のパッケージを指定

$ ncu -uではすべてのパッケージが対象になっていますが、特定のパッケージのみ行いたい場合は、下記のように$ ncu -uの後にパッケージ名を指定する形でコマンドを入力すれば可能です。

$ ncu -u xxx

上記でハイライト表示している部分に任意のパッケージ名を指定することで、そのパッケージのみ更新することができます。
また、複数のパッケージを指定したい場合は、下記のようにスペース区切りで指定すれば複数のパッケージを一度に指定・更新できます。

$ ncu -u xxx xxx xxx

特定のパッケージを除外

特定のパッケージを除外してバージョン情報を表示したいときは、下記のように-xを付けてパッケージ名を指定すれば、そのパッケージ以外の情報が表示されます。

$ ncu -x xxx

※ハイライト表示部分にパッケージ名を指定。

上記を踏まえて、特定のパッケージを除外しつつその他のパッケージをアップデートしたいときには、下記のようにコマンドを入力します。

$ ncu -u -x xxx

※ハイライト表示部分に除外したいパッケージ名を指定。

正規表現を使う

パッケージ名の指定には正規表現を使うこともできます。
例えば、gulpに関するもの(「gulp-ejs」とか「gulp-sass」のように頭に「gulp-」が付いているもの)を対象にしたい場合、下記のようにコマンドを入力することでパッケージが他にあってもgulp関連のみ表示させることができます。

$ ncu '/^gulp-.*$/'

上記を踏まえて、頭に「gulp-」と付いているパッケージのみアップデートしたいときは、下記のようにコマンドを入力します。

$ ncu -u '/^gulp-.*$/'

また、上とは逆で頭に「gulp-」が付いていないものを対象にしたい場合は、下記のようにコマンドを入力することで確認できます。

$ ncu '/^(?!gulp-).*$/'

以上、「npm-check-updates」を使ってパッケージをまとめてアップデートする方法でした。
ここでは基本的な使い方とオプションを紹介しましたが、オプションはこれ以外にもあり、それらの使い方も含め詳細は以下で確認できます。

Close the search window,
please press close button or esc key.