Spring Boot + npm + Geb で入力フォームを作ってテストする ( その９６ )( postcss を 7.0.29 → 8.3.8 へ、postcss-cli を 7.1.1 → 9.0.1 へ、prettier を 2.0.5 → 2.4.1 へ、stylelint を 13.3.3 → 13.13.1 へバージョンアップする )

概要

記事一覧はこちらです。

Spring Boot + npm + Geb で入力フォームを作ってテストする ( その９５ )( eslint を 6.8.0 → 7.32.0 へ、jest を 26.0.1 → 27.2.4 へバージョンアップする ) の続きです。

• 今回の手順で確認できるのは以下の内容です。
  • autoprefixer を 9.7.6 → 10.3.6 へ、cssnano を 4.1.10 → 5.0.8 へ、postcss を 7.0.29 → 8.3.8 へ、postcss-cli を 7.1.1 → 9.0.1 へバージョンアップします。
  • prettier を 2.0.5 → 2.4.1 へバージョンアップします。
  • stylelint を 13.3.3 → 13.13.1 へ、stylelint-config-standard を 20.0.0 → 22.0.0 へバージョンアップします。

参照したサイト・書籍

目次

1. autoprefixer を 9.7.6 → 10.3.6 へ、cssnano を 4.1.10 → 5.0.8 へ、postcss を 7.0.29 → 8.3.8 へ、postcss-cli を 7.1.1 → 9.0.1 へバージョンアップする
2. prettier を 2.0.5 → 2.4.1 へバージョンアップする
3. stylelint を 13.3.3 → 13.13.1 へ、stylelint-config-standard を 20.0.0 → 22.0.0 へバージョンアップする
4. 最後に各種コマンドや build で問題がないか確認する

手順

autoprefixer を 9.7.6 → 10.3.6 へ、cssnano を 4.1.10 → 5.0.8 へ、postcss を 7.0.29 → 8.3.8 へ、postcss-cli を 7.1.1 → 9.0.1 へバージョンアップする

以下のコマンドを実行して最新のバージョンにします。

• npm install --save-dev autoprefixer@10.3.6
• npm install --save-dev cssnano@5.0.8
• npm install --save-dev postcss-cli@9.0.1

npm test コマンドを実行するとテストは全て成功しましたが、

npm run build コマンドを実行すると Please install PostCSS 8 or above のメッセージが出力されました。postcss-cli をバージョンアップしただけでは postcss はバージョンアップされないようです。

node_modules/postcss/CHANGELOG.md を確認したところ 7.0.29 がインストールされていました。https://www.npmjs.com/package/postcss を見ると最新バージョンは 8.3.8 なので、以下のコマンドを実行します。

• npm install --save-dev postcss@8.3.8

npm run build コマンドを実行すると今度は何の警告・エラーメッセージも出力されずに終了しました。

prettier を 2.0.5 → 2.4.1 へバージョンアップする

以下のコマンドを実行して最新のバージョンにします。

• npm install --save-dev prettier@2.4.1

npm test コマンド、npm run build コマンドのどちらも何の警告・エラーメッセージも出力されずに終了しました。

今回のバージョンアップでは１ファイルだけフォーマットし直されており、改行位置が少し変更されていました。

stylelint を 13.3.3 → 13.13.1 へ、stylelint-config-standard を 20.0.0 → 22.0.0 へバージョンアップする

以下のコマンドを実行して最新のバージョンにします。

• npm install --save-dev stylelint@13.13.1
• npm install --save-dev stylelint-config-standard@22.0.0

npm test コマンド、npm run build コマンドのどちらも何の警告・エラーメッセージも出力されずに終了しました。

最後に各種コマンドや build で問題がないか確認する

最後にコマンド、build で問題がないか一通り確認します。

npm test コマンドは問題ありません。

npm run build コマンドも問題ありません。

clean タスク実行 → Rebuild Project 実行 → build タスク実行も問題ありません。

gebTest タスクも問題ありません。

IntelliJ IDEA の「Settings」ダイアログを開いて「Language & Frameworks」-「Node.js and NPM」を表示し、バージョンアップ後の状態も記載しておきます。

履歴

2021/10/04
初版発行。