b8a0536daf8d25.md

title	emoji	type	topics	published
vscodeおすすめ設定/拡張機能	📝	idea	vscode	true

概要

普段使っていて便利だなぁと思う設定と拡張機能を紹介します 設定はsetting.jsonに追記して使ってみてください

設定

GitHub Theme

GitHubが作っているテーマ GitHub Dark Dimmedというダークテーマが見やすくておすすめ

JetBrains Mono

JetBrainsが作っているプログラミング用フォント 見やすくておすすめ

使用方法

1. フォントを公式サイトからダウンロードしてインストール
2. vscodeのsetting.jsonで "editor.fontFamily": "'JetBrains Mono', Menlo, Monaco, 'Courier New', monospace",を指定する

"editor.formatOnSave": true,

ファイル保存時にフォーマットを行う

"editor.formatOnPaste": true,

ペースト時にフォーマットを行う

"editor.guides.bracketPairs": true, "editor.bracketPairColorization.enabled": true,

カギ括弧に色がつく 以前は拡張機能で実現されていたが、公式機能として用意された

"editor.suggestSelection": "recentlyUsed",

以前入力した文字をサジェストしてくれる

"files.insertFinalNewline": true,

保存時、ファイル末尾に改行を入れてくれる

"workbench.editor.enablePreview": false,

ファイル検索から表示したファイルが、別のファイルを開こうとした時に閉じてしまう問題を解消してくれる

拡張機能

CSS Navigation

CSSクラスへのピークと入力時の補完を行ってくれる 有名なCSS PeekとIntelliSense for CSS class names in HTMLが一緒になったイメージ

Error Lens

エラーやTipsを行内に表示してくれる 数が多いとコードが見づらくなる可能性もあるので注意

Quit Control for VSCode

アプリケーションを終了させる時に確認のダイアログを表示してくれる ミスタイプでアプリケーションがいきなり終了してしまうとかがなくなる

Colonize

ショートカットキーで行末にセミコロンを追加してくれる 行末セミコロンが必要なDartとかで便利

rust-analyzer

RustのLSP 補完やピークを行えるようにしてくれる

Thunder Client

GUIベースのHTTPクライアント Postman的なことがvscodeの中で行えて便利

まとめ

普段使っているvscodeで便利な設定や拡張機能を紹介しました 便利なツールを使いこなすことは生産性アップにも繋がると思うので、ぜひ試してみてください！