下記イベントに伴う記事のひとつとして書かせていただいた。
【オンライン開催】おはようエンジニア 特別編 - エディタの開発環境に役立つエクステンション
筆者 (私) は IntelliJ や VSCode の二刀流として Web 界隈に生息している。
可能な限り IntelliJ 上で済ませるようにしており Docker (MySQL や PostgreSQL) なども IntelliJ 上で動かしている。
私がお世話になっているエクステンション
私自身少ないなりにもエクステンションをインストールしているが、エディタの機能をフル活用している訳でもありません。
ちなみに Vetur や Flutter Intl は固有のフレームワークを使う際に便利なエクステンションで、全てのデベロッパが必要になる訳ではありません。
- Git Graph
- Bracket Pair Colorizer 2
- IntelliJ では Rainbow bracket
- Code Spell Checker
- Draw io integration
- IntelliJ では Diagrams net Integration
- Remote Containers
- Vetur
- Flutter Intl
- IntelliJ でも Flutter Intl
またエクステンションでは無いものの、ファイル保存時に自動で ESLint fix してくれる機能がある。 IntelliJ では File Watcher という機能が存在する。
VSCode でも setting.json に下記設定を追加することで同様の機能を実現できる。
{
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
}
}
Git Graph
コミット履歴をツリー形式で表示してくれる。
Bracket Pair Colorizer 2
対応する括弧を色分けして表示してくれる。
IntelliJ でも同様のエクステンションが存在する。
Code Spell Checker
スペルミスを検出してくれる。
Draw io integration
設計図を描画してくれる。
IntelliJ でも同様のエクステンションが存在する。
Remote Containers
Docker 内で VSCode Server を動かす。ソースコードはボリュームマウントするため Docker 内から見える (VSCode で編集できる)
Vetur
言わずと知れた Vetur で Vue ファイルを操作しているとオススメのメッセージが表示されるため、ご存知の方も多いでしょう。
Flutter Intl
pubspec.yaml に必要なライブラリ書いてインストールする。適宜初期化してロケールを追加すれば、自動で /lib/generated に吐き出してくれる。
IntelliJ でも同様のエクステンションが存在する。