VSCodeのHTMLフォーマット設定

前書き

VSCodeで何を書くかは人それぞれだと思うんですけど

多くの人は利用する理由の中にHTMLファイルを開くための理由があるかなと思います。

実際に僕もHTMLを開くとき、Adobeに契約をしているから、DreamWeaver CCとか使えるんですけど

軽量で、やりたいことがプラグインでできちゃうVSCodeを最近では多く使います。

実際企業常駐案件にいく時にも多くのプロジェクトでVSCodeを使っている会社様がありました。

だからという訳でもないですが、コーディングする際に省ける作業は省いた方が仕事も早くミスも少なくできますよ。

やる事

HTMLフォーマットのキャプチャ
HTMLフォーマットのキャプチャ

最初にHTMLファイルを開いているエディタ内で右クリックをすると「ドキュメントのフォーマット」が出てきます。

自分の場合は、何個かフォーマットの設定ファイルがあったらしく、下記のように選べました。

HTMLフォーマットの利用するフォーマットの指定

とりあえず、HTML言語機能っていうのを選んでみたんですけど、色々いう前に結果が下記です。

HTMLフォーマット後

なんでしょう、良いんですけど多分余分な改行とかをあまり好まない人は好きじゃなさそう。

今回は、とりあえず自分がしたいフォーマットを設定できれば良いかなって思います。

インデントサイズを4から2に変更する

インデントサイズを変更する

画像内にもコメント書きましたが、スペース4となっているところを2に変更することで、以降インデントが2に設定されます。

こんなもんじゃないけど、随時更新していきます。