0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

VSCodeのFormat On saveが動かない

Last updated at Posted at 2025-02-23

症状

しばらくぶりにVSCodeを使うと、Prettierアイコンが赤色になり、Format On Saveが使えませんでした。

スクリーンショット 2025-02-23 14.27.01.png

OutputではCannot find Prettier package.jsonとのこと。

スクリーンショット 2025-02-23 14.27.30.png

設定のFormat On Saveは有効になっているし、Default FormatterもPretteirになっていました。
Prettierを再インストールしても直りません。

スクリーンショット 2025-02-23 14.33.47.png

解決方法

User settingsの方のsettings.jsonに下記のように、拡張機能のPrettierではなく、localにインストールされたPrettierを使用するように設定されていました。
しかし、localにPrettierをインストールしているわけではないので、動かなかったようです(多分)。
こちらを削除すると自動整形してくれるようになりました。

"prettier.prettierPath": "/usr/local/lib/node_modules/prettier"

おまけ(settings.jsonの編集方法)

settings.jsonは下記より編集できます。

  • command + shift + Pを押す
  • 下のような入力ボックスがVSCodeの上の方に現れるので、"settings"などで検索する
  • "Preference: Open User Settings(JSON)"を選択する

スクリーンショット 2025-02-23 14.28.25.png

最後に

今回の不具合の原因になったコードがなぜ追加されていたのかはわかりませんが、恐らくAIとやりとりする中で理解せずに追加してしまったのではないかなーと思います。

最後までお読みいただきありがとうございます!
間違い等あればご指摘お願い致します!

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?