エディタをAtomからVisual Studio Code（VS Code）に乗り換えたので、おすすめの拡張機能を紹介します

ここ数年、開発に使用するエディタとしてAtomを愛用していたのですが、この度Visual Studio Code（VS Code）に乗り換えました。
しばらく使ってみておおむね環境が整ってきたので、特定のプログラミング言語やフレームワークによらずおすすめできる拡張機能をご紹介します。

Bracket Pair Colorizer 2

ファイル中の対応する括弧同士に同じ色をつけたり、入力カーソルがあるブロックにガイドを表示したりします。

色が多すぎると目が疲れるので、色自体は#ffffff固定にしてガイド表示のためだけに使っています。

{
  "bracket-pair-colorizer-2.colors": [
    "#FFFFFF"
  ]
}

change-case

コマンドから、変数名などの文字列をキャメルケース、スネークケース、ケバブケースなどに変換できるようになります。

Code Cover

テストのカバレッジをソースコード上に可視化します。
カバレッジを可視化する拡張機能の中でこれが一番好みの見た目なので使っていますが、2016年以降更新されていないようなので今後のアップデートはあまり期待できません。

Copy filename

コンテキストメニューから、ファイル名のコピーができるようになります。

Docker

VS Code上でDockerの操作が行なえます。

Duplicate action

コマンドやコンテキストメニューから、ファイルの複製ができるようになります。

EditorConfig for VS Code

EditorConfigを使用しているプロジェクトにおいて、ファイルで使用する改行コードやインデントスタイルをプロジェクトの設定に合わせられます。

GitHub Pull Requests and Issues

VS Code上でGitHubのプルリクエストやイシューを見たり、つくったりできます。
簡単なものであれば、リポジトリのクローンからのプルリクエスト作成、そしてマージまでの一連のフローがVS Code上で完結します。

GitLens

VS Code上で、標準ではできないGit関連の操作が行なえます。

デフォルトでは独自のビューに表示されますが、なるべくビューを切り替えたくないので「ソース管理」ビュー内に表示しています。

{
  "gitlens.views.compare.location": "scm",
  "gitlens.views.fileHistory.location": "scm",
  "gitlens.views.lineHistory.location": "scm",
  "gitlens.views.repositories.location": "scm",
  "gitlens.views.search.location": "scm"
}

indent-rainbow

インデントレベルに応じて色をつけられます。

設定ファイルなどでよく使われるJSONとYAMLで有効化しています。

{
  "indentRainbow.includedLanguages": [
    "json",
    "jsonc",
    "yaml"
  ]
}

Japanese Language Pack for Visual Studio Code

VS CodeのUIを日本語化します。

markdownlint

markdownlintによって、Markdownの構文をチェックできます。

PlantUML

VS Code上でPlantUMLのプレビューを表示できます。

レンダリング手法としてローカルかサーバーを選べますが、公式のPlantUML Web Serverを使用しています。

{
  "plantuml.render": "PlantUMLServer",
  "plantuml.server": "https://www.plantuml.com/plantuml"
}

Project Manager

ワークスペースやフォルダを、プロジェクトとして管理できます。
複数のワークスペースを扱う場合は必須機能と言えるでしょう。

Rainbow CSV

CSVファイルやTSVファイルをカラフルに表示します。

Settings Sync

複数のデバイスで設定や拡張機能を同期できます。
VS CodeにSettings Sync機能が搭載されるまでの繋ぎとして利用しています。

Todo Tree

「TODO」や「FIXME」などで始まるアノテーションコメントに色をつけたり、ツリー形式で一覧表示したりできます。

アノテーションコメントにはいくつかのバリエーションがありますが、Atomのlanguage-todoを踏襲したものを使用しています。

{
  "todo-tree.general.tags": [
    "BUG",
    "CHANGED",
    "COMBAK",
    "DEBUG",
    "FIXME",
    "HACK",
    "IDEA",
    "NB",
    "NOTE",
    "OPTIMIZE",
    "QUESTION",
    "REVIEW",
    "TEMP",
    "TODO",
    "WARNING",
    "XXX"
  ]
}