VS Codeを便利＆快適にできるプラグイン紹介

コーディングの際のエディターは何を使用しているでしょうか？
Microsoftが提供しているVisual Studio Code（vsCode）を使用する方も多いと思います。
そのままでも高機能なvsCodeですが、今回は入れておくともっと便利＆快適にできるプラグインを紹介します！

初期で入れておきたいプラグイン

Japanese Language Pack for Visual Studio Code

vsCodeの表記を日本語に変換してくれる。インストールした直後は英語表記のため、日本語にしたい場合このプラグインを使用すると便利です。

Live Server

HTMLやCSSの修正に合わせてローカルサーバー上でリアルタイムでプレビュー表示ができる。

Live Sass Compiler

Sassを自動でコンパイルしてくれる。先ほどのLive Serverと合わせて使用すると便利です。

あると便利なプラグイン（入力補助編）

Auto Rename Tag

片方のタグを編集すると、対応するもう片方のタグ名も自動的に編集してくれる。タグエラー防止に役立ちます。

HTMLHint

HTMLの入力チェックを行ってくれる。スペルミスや記述ミスの防止に役立つので、初心者の方にもおすすめです。

IntelliSense for CSS class names in HTML

HTMLでクラスを指定する際に、CSSで定義しているクラスが入力候補として表示されるようにできる。

Path Autocomplete

ファイルパス候補を出してくれる。

Insert <br> Tag

shift + Enter で<br>タグが挿入されるようにできる。

あると便利なプラグイン（インデントや視覚補助編）

Prettier – Code formatter

JavaScriptやTypeScript、CSS、HTMLなどのコードを整形可能なコードフォーマッター。

Simple icons

フォルダやファイルのアイコンを変更することができます。

indent-rainbow

深さに応じて、インデントをカラーリングしてくれる。

Highlight Matching Tag

選択したものに対応する開始タグ/閉じタグをハイライトしてくれる。

Color Highlight

カラーコードをその色でマーキングしてくれる。

zenkaku

全角スペースがあった場合、ハイライトされて視覚的に教えてくれる。

Trailing Spaces

行末などに不要なスペースがあった場合、ハイライトされて視覚的に教えてくれる。

いかがでしょうか
他にも便利なプラグインはたくさんあるので、自分に合った環境に整えて快適にコーディングしていきましょう！

エディタ紹介についてはこちら
↓↓↓
https://www.cn-door.com/blog/1152/