Visual Studio Code | 整形のショートカットキーと保存時に自動整形する設定

2021-06-01Visual Studio Code 設定,Visual Studio Code

Visual Studio Code

Visual Studio Code(VSCode)でコードを整形する整形のショートカットキーと、ファイルの保存時に自動整形する設定に切り替える手順を紹介しています。

※phpなど一部のコードは、PHP Intelephenseなどの拡張機能を必要とします

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

編集中のファイル内にあるコードを整形するデフォルトで割り当てられているショートカットキーです。
WindowsとmacOSで操作が違います。

OSショートカットキー
WindowsShift + Alt + F
macOption + F

ファイルの保存時に自動整形する設定

ファイルの保存時に自動整形をするようにするには「Format ON Save」を有効にします。

この設定項目は「File(ファイル)」「Preference(ユーザー設定)」「settings(設定)」「Text Editter(テキストエディター)」「Formatting(書式設定)」にあります。

設定の検索窓で「format」を検索すると見つかります。

「Format ON Save」を有効にします。

Visual Studio CodeでSFTP

Format ON Save
ファイルを保存するときにフォーマットします。フォーマッタが有効でなければなりません。ファイルの遅延保存やエディターを閉じることは許可されていません。

保存時の自動整形機能は、VSCodeに各言語のフォーマッタがインストールされていない場合、保存だけが実行されエラーは表示されません。

インデントのスペース・タブ切り替えとサイズの変更

Visual Studio Codeはデフォルトのインデント設定はスペースでサイズ4となっています。

ショートカットキーや自動での整形時も、コードのインデント設定に基づいて、スペースまたはタブとそのサイズが入力されます。

開いているファイルのみであればエディター下部のファイルのインデントの部分をクリックすると設定を変更できます。
この場合、他のファイルや新規ファイルに影響を与えません。

デフォルト値を変更する場合は、設定からIndent関連の設定を変更する事が可能です。

インデント関連の設定方法は以下の記事にて紹介しています。