npm installしてあるパッケージの現状と最新のバージョン確認とアップデート方法

  • ブックマーク
  • -
    コピー

WordPressテーマを開発する際には、基本的に自家製npm-scriptを使っているのですが、気にせず使っていると徐々にインストールしているパッケージのバージョンが古くなってしまいます。ですので、定期的な確認と更新が必要になってきます。

その際に、どのような方法で行なっているかをメモしておきます。

npm-check-updates を使う

$ npm install -g npm-check-updates

と、グローバルインストールします。すると、$ ncuというコマンドを使えるようになるので、

$ ncu

と実行します。すると、

[====================] 24/24 100%

 @babel/core                  ^7.4.5  →   ^7.5.4 
 @babel/preset-env            ^7.2.0  →   ^7.5.4 
 autoprefixer                 ^9.4.2  →   ^9.6.1 
 browser-sync                ^2.26.3  →  ^2.26.7 
 cssnano                      ^4.1.7  →  ^4.1.10 
 node-sass                   ^4.10.0  →  ^4.12.0 
 onchange                     ^5.1.3  →   ^6.0.0 
 postcss-cli                  ^6.0.1  →   ^6.1.3 
 rimraf                       ^2.6.2  →   ^2.6.3 
 rollup                      ^0.67.4  →  ^1.17.0 
 rollup-plugin-babel          ^4.0.3  →   ^4.3.3 
 rollup-plugin-commonjs       ^9.2.0  →  ^10.0.1 
 rollup-plugin-node-resolve   ^3.4.0  →   ^5.2.0 
 uglify-js                    ^3.4.9  →   ^3.6.0 
 watchify                    ^3.11.0  →  ^3.11.1 

Run ncu -u to upgrade package.json

最後にncu -upackage.jsonをアップデートしてね!と書いてあるので実行します。

$ ncu -u
Upgrading /Users/********/package.json
[====================] 24/24 100%

 @babel/core                  ^7.4.5  →   ^7.5.4 
 @babel/preset-env            ^7.2.0  →   ^7.5.4 
 autoprefixer                 ^9.4.2  →   ^9.6.1 
 browser-sync                ^2.26.3  →  ^2.26.7 
 cssnano                      ^4.1.7  →  ^4.1.10 
 node-sass                   ^4.10.0  →  ^4.12.0 
 onchange                     ^5.1.3  →   ^6.0.0 
 postcss-cli                  ^6.0.1  →   ^6.1.3 
 rimraf                       ^2.6.2  →   ^2.6.3 
 rollup                      ^0.67.4  →  ^1.17.0 
 rollup-plugin-babel          ^4.0.3  →   ^4.3.3 
 rollup-plugin-commonjs       ^9.2.0  →  ^10.0.1 
 rollup-plugin-node-resolve   ^3.4.0  →   ^5.2.0 
 uglify-js                    ^3.4.9  →   ^3.6.0 
 watchify                    ^3.11.0  →  ^3.11.1 

Run npm install to install new versions.

次はnpm installでバージョンをあげてね!って言われるので、

$ npm install
added 16 packages from 22 contributors, updated 5 packages and audited 15640 packages in 5.681s

ちゃんとアップデートされているか確認するために、再度$ncu -uを実行してみます。

$ ncu -u
Upgrading /Users/*****/package.json
[====================] 24/24 100%

All dependencies match the latest package versions :)

問題ありませんね。

このように、アップデートできるバージョンを確認しながら更新していけば大丈夫でしょう。

ちなみに、$ncu -u [package-name]という感じで、特定のパッケージを指定して更新をすることも可能です。

ホームページのお話しませんか?

気楽にカフェや喫茶店で雑談するくらいの雰囲気で、あなたのホームページのお話をしませんか?

  • ブックマーク
  • -
    コピー

この記事を書いた人

久野 晃司

岐阜を中心にWeb制作全般のお仕事をしているフリーランスです。趣味はサッカー・F1観戦。英国プレミアリーグ、マンチェスターユナイテッドを長年愛しています。英国滞在歴2年、日常英会話くらいは大丈夫です。20ヶ国以上列車で単独周遊してきました。WordPress大好きです。Gifu WordPress Meetup共同オーガナイザー・CoderDojo岐阜チャンピオンなどの活動もしています。