VSCode「Visual Studio Code」はMicrosoftが開発している高機能コードエディターで、無料で利用することができます。この記事ではVSCode HTML、CSS、JS、PHPファイルを整形する方法を見ていきます。
ショートカット一つで一括整形させたい
整形する方法を確認します。
ショートカット
VSCode ではコードを整形させる、ショートカットが用意されています。
Shift + Alt + F | Windows |
shift + ⌥ + F | macOS |
VSCode では最初からHTML と JS ファイルの整形が可能です。
拡張機能を追加して、CSS、PHP ファイルの整形もできるようにしていきます。
拡張機能
この記事では、CSS Formatter と、PHP Intelephense の拡張機能をインストールして、CSSとPHPの整形を行う方法を見ていきます。
CSS Formatter
![](https://logsuke.com/wp-content/uploads/2022/04/スクリーンショット_2022-04-27_13_52_27-2-1024x604.jpg)
① 拡張機能
② 検索欄で css formatter
を検索します。
③ CSS Formatter を選択
④ インストールします。
PHP Intelephense
![](https://logsuke.com/wp-content/uploads/2022/04/スクリーンショット_2022-04-27_14_43_19-1024x605.jpg)
① 拡張機能
② 検索欄で、PHP Intelephense
を検索します。
③ PHP Intelephense を選択
④ インストールします。
これでCSS PHP でも整形のショートカットが使えるようになりました。