VscodeでTypescript/Reactのコードをオートインデント(自動整形)したい

Question

いまPrettier+というvscodeのツールを使ってるのですが、全く動きません。
一応setting.jsonに"editor.formatOnPaste": true,を記述しています。
環境はTypescript/ReactNativeです。

一応エディターにもPrettier+とででます。

Typescriptのエディターで以下のようにエラー(実際は動きます)がでてるのですが、これと何か関係あるのでしょうか？

オートインデントじゃないとストレスがやばいので、セーブしたときに勝手にインデントしてほしいです。
どなたか設定方法をご教示いただけると幸いです。

よろしくお願いいたします。

Answer 1

公式ドキュメントに記載の通り、settings.jsonで formatOnPaste だけではなく formatOnSave を指定ですね。
あと、言語別のフォーマッター指定が抜けてるかと。

{
  "[typescript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "editor.formatOnSave": true
}

Comments

[Hinoarashi.]

ご回答ありがとうございました！！

Answer 2

以下の手順で自己解決しました。

①Prettier - Code formatterをVSコードでプラグインをインストール
②VSコードの設定からEditor: Default Formatterと検索し、デフォルトのフォーマッターをPrettier - Code formatterと選択
③VSコードの設定のsetting.jsonで

"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true

を追記する