36
24

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 1 year has passed since last update.

はじめに

Visual Studio Codeでは、
デフォルトでコードを整形するショートカットキーが割り当てられています。
このショートカットキーを押すことでもフォーマット(整形)されますが、毎回保存前に押すのは非常に面倒くさいです。

Windows mac OS
Shift + Alt + F shift + ⌥ + F

実はVisual Studio Codeでは保存時に自動整形する方法があります。
設定しておくと便利なので是非設定しておきましょう。

手順

以下のようなコードがあるとします。

image.png

設定を開き、そこから「format on save」と検索します。

image.png

Format On Saveにチェックを入れるます。
あとは保存時にフォーマッターが効いて、ソースコードにインデントが適用されれば完了です。

image.png

インデントの種類の変更

ちなみにインデントの種類の変更に関してですが、
Visual Studio Code右下のこちらの画像では「スペース:2」となっている箇所をクリックします。

image.png

スペースによるインデントを押下。

image.png

変更したいタブのサイズを選択します。
4に変更してみます。

image.png

保存時に変更が適用されてインデントのスペーずが4つでフォーマットされました。

image.png

36
24
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
36
24

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?