99
45

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

prettier onSave vscode 動かない時の対処法

Last updated at Posted at 2020-10-24

今回は自分が一番苦労したprettierのonSaveが効かない時の対処法を述べていこうと思います。
1スクリーンショット 2020-10-25 8.48.21.png
Vscodeの設定画面を開いてEditor:Format On Saveにチェックを入れる。
2スクリーンショット 2020-10-25 8.49.47.png
Vscodeの設定画面を開いてEditor:Default Formatterがnullになっていないかチェックをする。
自分の場合はesbnp.prettier-vscodeで通常通りprettierを走らせることができました。

*追記上記のesbnp.prettier-vscodeの方法でもprettierが効かない人はbysabi.prettier-vscode-standardに変えてみてください。

今回はPrettierのonSaveが効かない場合の対処法を書きました。 巷の解決法は1しかなく。自力で解決するのに時間がかかってしまったのでつまづいてる方の手助けになれたら幸いです。

また、この解決方でもprettierを走らせることができない場合はcommit時にprettierを走らせる実装をしてみてはいかがでしょうか?

pakege.json
"lint-staged": {
    "*.{html,css,md,json,yaml}": "prettier --write",
    "*.{js,ts,tsx}": [
      "prettier --write"
    ]
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  }

lint-stagedとhuskyとprettierをnpm installしてpakege.jsonにこのような記述を描いてあげるとcommit時にprettierが走ってくれます。

99
45
1

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
99
45

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?