---
author: usbharu
draft: false
categories:
  - 技術
date: 2025-02-28T00:14:48+09:00
tags:
  - VSCode
  - 開発環境
keywords:
  - VSCode
  - 開発環境
title: VSCodeの設定がいい感じになってきた
relpermalink: posts/2025-02-28/
url: posts/2025-02-28/
decription: VSCodeの設定がいい感じになってきた
---

コードエディタ、何使ってますか? 僕はAtom派だったんですが、なくなっちゃったのでVSCode使ってます。学校とかでも結構これを勧められることが多いんじゃないでしょうか。僕は特にこだわりとかはなく、プラグインが豊富で補完がある程度使い物になるコードエディタと言ったらもうこれぐらいしか無いので使ってます。

プログラミングするときは基本的にIDE使うんですが、RustとフロントエンドはVSCodeで書いています。

## 拡張機能

主にJS/TSとRustに関連するプラグインのみインストールしています。Reactとかは必要なプロジェクトのみで有効化したりしていますが、あんまりこだわりはないです。

### IntelliSense系

- IntelliCode
- IntelliCode API Usage Examples
- IntelliSense for CSS class names in HTML
- HTML CSS Support
- Path Intellisense

### フロントエンドとかGUIで使う系

僕はバックエンドでJS/TSは使わない(使うときはWebStorm使う)のでJS/TS系もここに入れています。

- Biome
- JavaScript and TypeScript Nightly
- Tauri
- IntelliSense for CSS class names in HTML
- HTML CSS Support

### Rust系

Docs ViewとかError LensとかはRustでしか使わないのでここに入れた。今後Rustのデバッグ関連増えていきそうな予感

- Tauri
- rust-analyzer
- Serial Monitor
- Docs View
- Error Lens
- Even Better TOML

### その他

Dockerは正直いらんかも

- Japanese Language Pack for Visual Studio Code
- Docker
- Code Spell Checker
- Markdown All in One
- YAML
- WakaTime

## 設定

### 本体の設定系

#### workbench.startupEditor

起動時の画面

`"workbench.startupEditor": "none"`

起動時にそんな画面要らないよね

#### editor.wordWrap

折り返しの設定

`"editor.wordWrap": "on"`

これの設定ステータスバーから変更できるようにしてほしい

#### window.autoDetectColorScheme

ダークモードをシステムのモードとあわせる

`"window.autoDetectColorScheme": true`

Auto Dark Mode(Windowsのソフト)とかと合わせていい感じ

#### editor.suggest.showKeywordsとeditor.suggest.showWords

サジェストに文中の単語を表示するか

`"editor.suggest.showKeywords": false`
`"editor.suggest.showWords": false`

IntelliSenseとかの賢い補完以外は邪魔なので無効化

#### emmet.showExpandedAbbreviation

なんかよくわからないけどhtmlのタグとかを簡単に出せる機能らしいです。

`"emmet.showExpandedAbbreviation": "inMarkupAndStylesheetFilesOnly"`

最っっっっ高に邪魔なのでhtml/css以外で無効化 なんでこれ既定値が`always`なんだよ

#### editor.linkedEditing

htmlタグをいい感じに編集できるようになったりする

`"editor.linkedEditing": true`

便利

#### explorer.confirmDelete

ファイルの削除時に聞かない

`"explorer.confirmDelete": false`

まぁうざいよね

#### files.autoSaveとfiles.autoSaveWhenNoErrors

エディターがフォーカスを失ったときに自動で保存

`"files.autoSave": "onFocusChange"`

ファイルにエラーがあったときは自動保存しない

`"files.autoSaveWhenNoErrors": true,`

これはホットロードが結構使われてるフロントエンド界隈だと便利かも? Tauri&Rustの組み合わせと相性は悪いみたいですが…

### Git系

#### git.autofetch

定期的にgit fetchしてくれるやつ

`"git.autofetch": true`

まぁ便利

#### git.confirmSync

gitで同期前(pullかな?)に確認をしない

`"git.confirmSync": false`

#### git.enableSmartCommit

ステージされた変更がゼロのときは自動で全部の変更をコミット

`"git.enableSmartCommit": true`

たまにやらかすけど便利

### 言語系

#### Rust

多いのでまとめて

```json
    "rust-analyzer.inlayHints.bindingModeHints.enable": true,
    "rust-analyzer.inlayHints.closureCaptureHints.enable": true,
    "rust-analyzer.inlayHints.closureReturnTypeHints.enable": "always",
    "rust-analyzer.inlayHints.discriminantHints.enable": "always",
    "rust-analyzer.inlayHints.expressionAdjustmentHints.enable": "always",
    "rust-analyzer.inlayHints.genericParameterHints.lifetime.enable": true,
    "rust-analyzer.inlayHints.genericParameterHints.type.enable": true,
    "rust-analyzer.inlayHints.lifetimeElisionHints.useParameterNames": true,
    "rust-analyzer.inlayHints.rangeExclusiveHints.enable": true,
    "rust-analyzer.inlayHints.reborrowHints.enable": "always",
    "rust-analyzer.inlayHints.typeHints.hideClosureInitialization": true,
    "rust-analyzer.inlayHints.typeHints.hideNamedConstructor": true,
```

とにかく全ての情報を表示する設定になっています。必要な～と思ったらだんだん消していこうかなと

`"rust-analyzer.check.command": "clippy"`

Lintをclippyに変更
Rustをメインで使っている分野が組み込みなので実行前にできるだけ不確定要素(?)を減らしたいのでちょっと重いけどClippy使ってます。

#### JS/TS

関数の補完時にカッコを入力する

`"javascript.suggest.completeFunctionCalls": true`
`"typescript.suggest.completeFunctionCalls": true`

逆になんでカッコ入らないの設定がデフォルトなのか

## さいごに

こんなもんじゃないでしょうか。さすがにIDEと比べると全然機能不足って感じですが、軽量なことを考えると十分使えると思います。他に強化するとしたらあとは後置補完とか、リファクタリング機能とかですかね。あんまりやりすぎて重たくなったら本末転倒なのでいい塩梅を見つけたいです。