npmの各packageを最新バージョンに更新する方法

package.jsonでインストールしているパッケージをを最新化にする方法。

イントロダクション

npmのパッケージアップデートはセキュリティ観点で必須ですが、手動で実行するのは手間なので、npm-check-updatesを使って自動アップデートする方法を紹介します。

結論

npm-check-updatesを入れて、コマンド打つとpackage.jsonを更新してくれる。

$ npm i -D npm-check-updates

# package.jsonのパッケージをアップデート
$ npx -p npm-check-updates -c "ncu -u"

# パッケージ更新
$ npm -i

詳細

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

公式では、 -g で案内されてるけど、疎結合の観点でグローバルには入れない派。

$ npm i -D npm-check-updates

package.jsonをアップデート

頻繁には実行しないので npx で実行する。

$ npx -p npm-check-updates -c "ncu -u"

# 例
npx -p npm-check-updates -c "ncu -u"
Upgrading /xxx/project/package.json
[====================] 13/13 100%

 @types/node          ^20.8.3  →  ^20.10.6
 @types/react        ^18.2.25  →  ^18.2.46
 @types/react-dom    ^18.2.11  →  ^18.2.18
 eslint               ^8.51.0  →   ^8.56.0
 eslint-config-next   ^13.5.4  →   ^14.0.4
 next                 ^13.5.4  →   ^14.0.4
 postcss              ^8.4.31  →   ^8.4.33
 tailwindcss           ^3.3.3  →    ^3.4.0
 typescript            ^5.2.2  →    ^5.3.3

Run npm install to install new versions.

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

説明不要ですね。

$ npm i

まとめ

dependabot使ってCIと合わせて更新するのが常套手段だけど、個人開発やCI導入前ならサクッと更新するのがよい。

参考