VSCodeのコードを整形するショートカットキー

こんにちは、コンスキです。

プログラミング多くの人が使っているコードエディタである「Visual Studio Code」。

VSCodeとも呼びますが、このVSCodeにおいてコードを整形するショートカットキーは何でしょうか？

今回は、VSCodeでコードを整形することができるショートカットキーを紹介します。

コードを整形するショートカットキー

次のショートカットキーを押すことで、VSCodeにおいてコードを整形することができます。

Windows ▶︎ Alt + Shift + F

Mac ▶︎ option + Shift + F

こんな感じ↓に一瞬で綺麗に自動整形してくれるのでとても便利です！

フォーマッターのインストールが必要

自動整形の機能を使うにはフォーマッタと呼ばれるものが必要です。

フォーマッタは1つのファイル形式に対して1つ必要です。

例を出させてください。

例えば、拡張子が「.py」であるファイルのフォーマッタがインストールしてあったとします。

この場合は拡張子が「.py」であるどのファイルも自動整形の機能を使えます。

しかし、拡張子が「.css」ファイルにおいては自動整形することができません。

また、フォーマッタがインストールされていない場合次の警告に似たようなものが表示されると思います。

この場合は、「Yes」または「フォーマッタをインストール」を選択して、フォーマッタをインストールしてください。

整形のショートカットキーを変えたい

自動整形のショートカットキーに他のキーを割り当てたいことがあると思います。

そんなときは、次のような手順で変えることができます。

ステップ1（このステップだけOSによって異なります）

Windows

メニューから「ファイル > ユーザ設定 > キーボードショートカット」の順番で選択する。

Mac

メニューから「Code > 基本設定 > キーボードショートカット」の順番で選択する。

ステップ2

検索欄に「ドキュメントのフォーマット」と入力する。

ステップ3

一番上に出てきたやつをダブルクリックする。

ステップ4

自動整形に割り当てたいキーの組み合わせを押した後、Enterキーを押す。

終わりに

ショートカットキーでコードを整形できるようになると、作業が早くなるだけじゃなくてかっこいいですよね。

このショートカットキーを知らない人に、「それどうやるの？」と聞かれたらぜひ教えてあげてください！