VSCode HTML整形（フォーマット）する方法

VSCode「Visual Studio Code」はMicrosoftが開発している高機能コードエディターで、無料で利用することができます。この記事ではVSCode HTML、CSS、JS、PHPファイルを整形する方法を見ていきます。

ショートカット一つで一括整形させたい

整形する方法を確認します。

ショートカット

VSCode ではコードを整形させる、ショートカットが用意されています。

VSCode では最初からHTML と JS ファイルの整形が可能です。

拡張機能を追加して、CSS、PHP ファイルの整形もできるようにしていきます。

拡張機能

この記事では、CSS Formatter と、PHP Intelephense の拡張機能をインストールして、CSSとPHPの整形を行う方法を見ていきます。

CSS Formatter

① 拡張機能

② 検索欄で css formatter を検索します。

③ CSS Formatter を選択

④ インストールします。

PHP Intelephense

① 拡張機能

② 検索欄で、PHP Intelephense を検索します。

③ PHP Intelephense を選択

④ インストールします。

これでCSS PHP でも整形のショートカットが使えるようになりました。