npmのパッケージをnpm-check-updatesで一括更新する方法

プログラミング

npm installでパッケージをインストールしようとすると、パッケージのバージョンの問題で失敗することがあります。そんな時はnpm-check-updatesでパッケージを一括更新して再度npm intallを試してみましょう。

エラー内容

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: undefined@undefined
npm ERR! Found: react@17.0.2
npm ERR! node_modules/react
npm ERR!   react@"^17.0.2" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^16.8.0" from @stripe/react-stripe-js@1.1.2
npm ERR! node_modules/@stripe/react-stripe-js
npm ERR!   @stripe/react-stripe-js@"1.1.2" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR! 
npm ERR! See /Users/apple/.npm/eresolve-report.txt for a full report.

今回はネットから拾ってきたサンプルコードを実行しようとしたらnpm installに失敗しました。reactとreact-stripe-jsの依存関係でエラーが出ているようです。

個別にバージョンを確認、更新しても良いですが、数が多かったりすると面倒そうなので一括更新できないか探してみました。npm-check-updatesというパッケージを使うと楽に更新できそうです。

npm-check-updatesの使い方

1.npm全体にインストール

//1.install globally
npm install -g npm-check-updates

2.ncuを起動

//move project directory and run ncu
ncu

/*--------------------------------------------------
example result
Checking /Users/apple/Documents/projects/test/with-stripe-typescript-app/package.json
[====================] 15/15 100%

 @types/micro               ^7.3.3  →    ^7.3.6     
 @types/micro-cors          ^0.1.0  →    ^0.1.2     
 @types/node               ^13.1.2  →  ^16.11.6     
 @types/react             ^16.9.17  →  ^17.0.33     
 typescript                 ^3.7.4  →    ^4.4.4     
 @stripe/react-stripe-js     1.1.2  →     1.6.0     
 @stripe/stripe-js           1.5.0  →    1.20.3     
 stripe                     8.56.0  →   8.184.0     
 swr                       ^0.1.16  →    ^1.0.1     
 use-shopping-cart           2.1.0  →     3.0.3     

Run ncu -u to upgrade package.json
--------------------------------------------------*/

3.パッケージを最新版に更新

//update packages
ncu -u

/*--------------------------------------------------
example result
[====================] 15/15 100%

 @types/micro               ^7.3.3  →    ^7.3.6     
 @types/micro-cors          ^0.1.0  →    ^0.1.2     
 @types/node               ^13.1.2  →  ^16.11.6     
 @types/react             ^16.9.17  →  ^17.0.33     
 typescript                 ^3.7.4  →    ^4.4.4     
 @stripe/react-stripe-js     1.1.2  →     1.6.0     
 @stripe/stripe-js           1.5.0  →    1.20.3     
 stripe                     8.56.0  →   8.184.0     
 swr                       ^0.1.16  →    ^1.0.1     
 use-shopping-cart           2.1.0  →     3.0.3     

Run npm install to install new versions.
--------------------------------------------------*/

4.npm installでパッケージをインストール

//npm install
npm install

まとめ

簡単にnpmのパッケージ全体を更新することができました。ネット上のサンプルコードはバージョンの問題で動かないこともあるので結構役立ちそうです。バージョンを更新することで、仕様が変わってコードが動かなくなることもあるので、その点は注意が必要です。特にメジャーアップデートしているパッケージを更新する際は気をつけましょう。

参考

こちらの記事をまんま参考にさせていただきました。

参考：npm のパッケージを最新版に更新する

ー　この記事をシェアする？　ー

この記事にコメントする

このサイトはreCAPTCHAとGoogleによって保護されています。プライバシーポリシーと利用規約が適用されます。

Related / 関連記事