VS Codeの設定を見直したときのメモ

これはなに Link to this heading

VS Codeの設定を見直したときのメモ。自分が何を何に設定しているかの整理。

環境 Link to this heading

  • VS Code 1.84.0

エディタの見た目の設定 Link to this heading

フォントやアイコン、カラーテーマなど。正直好み。

ミニマップの色はカラーテーマによってわかりにくくなりがちなので、わかりやすくするために変更している。

{
  // Overall Style
  "workbench.iconTheme": "vscode-icons", // icon theme
  "vsicons.dontShowNewVersionMessage": true, // color theme
  "workbench.colorTheme": "Nord Wave",
  "editor.fontFamily": "Cica, Firge, PlemolJP, 'Yu Gothic', 'Meiryo', Consolas,'Courier New', monospace, 'Ricty Diminished'", // font
  // Custom color
  "workbench.colorCustomizations": {
    // Minimap
    "minimapSlider.activeBackground": "#4c4d03a0",
    "minimapSlider.background": "#4c4d03a0",
    "minimapSlider.hoverBackground": "#4c4d03a0"
  },
}

カーソル Link to this heading

カーソルのスタイル。デフォルトだと個人的に見づらいので見やすくしている。

{
  // Cursor
  "editor.cursorWidth": 5, // カーソルの太さ
  "editor.cursorBlinking": "phase", // カーソルの点滅方式
  "terminal.integrated.cursorBlinking": true, // ターミナルのカーソルを点滅
}

ミニマップ Link to this heading

ミニマップのハイライトを常に表示し、詳細な文字を表示しないようにしている。ミニマップの文字は読まないので。ハイライトの色がわかれば十分。

{
  // Minimap
  "editor.minimap.showSlider": "always", // ミニマップのハイライトを常に表示
  "editor.minimap.renderCharacters": false, // ミニマップに文字を表示しない
}

ファイル作成時 Link to this heading

ファイル作成時の挙動。とくに改行文字は個人的に重要で、autoにすると意図しない動作をしそうなので指定している。

{
  // Create File
  "files.eol": "\n", // デフォルトの改行文字
  "editor.tabSize": 2, // tab size
  "workbench.editor.empty.hint": "hidden", // 新規ファイル作成時のヒントを非表示
}

ファイル保存時 Link to this heading

ファイル保存時の挙動。余計な空白や改行は削除するようにしている。

{
  // Save file
  "files.autoSave": "onWindowChange", // ファイル保存のタイミングを指定
  "files.insertFinalNewline": true, // ファイル末尾に改行を挿入
  "files.trimFinalNewlines": true, // ファイル末尾の最終行以外の空行を削除
  "files.trimTrailingWhitespace": true, // 行末およびファイル末尾の空白を削除
  "editor.trimAutoWhitespace": true, // インデント用の空白文字を、その行が空白文字だけの場合に削除する
}

ファイルスクロール時 Link to this heading

stickyScrollはファイルスクロール時に関数名や見出しを保持してスクロールしてくれる便利機能。

scrollBeyondLastLinepadding.bottomを指定することで、最終行よりも下にスクロールできる度合いを調整している。

{
  // Scroll file
  "editor.stickyScroll.enabled": true, // スクロール時に関数名などを保持
  "editor.scrollBeyondLastLine": false, // 最終行を超えてスクロールできなくする
  "editor.padding.bottom": 200, // 最終行より下に空白を追加
}

マウスホイールの挙動 Link to this heading

マウスホイールでズームできると画面共有時に便利。タブ切り替えのマウスホイール設定は好み。

{
  // Mouse wheel
  "editor.mouseWheelZoom": true, // マウスホイールでズームできるようにする
  "workbench.editor.scrollToSwitchTabs": true, // タブ上部でマウスホイール時に、shiftを押さなくてもタブを切り替える
}

エクスプローラを見やすくする Link to this heading

エクスプローラのインデントを調整し、見やすくしている。

{
  // Explorer
  "workbench.tree.indent": 18, // エクスプローラのインデント幅
  "workbench.tree.renderIndentGuides": "always", // エクスプローラのインデントガイドを常に表示
}

特定文字の可視化/強調 Link to this heading

可視化/強調できる文字は可能な限りそうする。

{
  // Text emphasis
  "editor.renderWhitespace": "all", // 空白文字を常に可視化
  "editor.unicodeHighlight.nonBasicASCII": true, //基本ASCII以外の文字を強調表示
  "editor.renderControlCharacters": true, // 制御文字を表示
}

その他のエディタ機能の設定 Link to this heading

その他の細かい設定。

括弧の色付けと縦線のガイドは必須といってもいいほど便利。

区切り文字の変更はデフォルトからハイフンを除外しているだけ。ダブルクリック時にハイフンを含めて選択できるようになるのが便利。

{
  // Editor
  "workbench.editor.tabSizing": "shrink", // タブのサイズ
  "editor.rulers": [
    80
  ], // 80文字目に縦線を表示
  "editor.lineHeight": 1.2, // 行の高さを変更
  "editor.bracketPairColorization.enabled": true, // 括弧に色を付ける
  "editor.guides.bracketPairs": true, // 対応する括弧のガイドを表示する
  "editor.wordSeparators": "`~!@#$%^&*()=+[{]}\\|;:'\",.<>/?", // 区切り文字を変更(ハイフンを除外)
  "telemetry.telemetryLevel": "off", // データ収集させない
  "editor.accessibilitySupport": "off", // スクリーンリーダーに最適化しない
  "window.title": "${dirty}${activeEditorMedium}${separator}${rootName}", // 検索欄に表示される文字列を変更
  "workbench.startupEditor": "none", // 起動時に表示する画面の変更
  "editor.inlineSuggest.enabled": true, // インライン候補を自動表示
// DiffEditor
  "diffEditor.ignoreTrimWhitespace": false, // 空白文字の変更を無視しない
  // Suggestion
  "editor.acceptSuggestionOnEnter": "off", // Enterで予測候補が入力されないようにする
  "editor.suggestSelection": "first", // 最初の候補を選択
  // Debug
  "debug.inlineValues": "on", // デバッグ中に行内に変数値を表示
}

Gitの挙動 Link to this heading

autofetchを有効にすることでpullし忘れを防いでいる(まあ忘れるときは忘れる)。

{
  // Git
  "git.autofetch": "all", // 自動fetchをON
}

ターミナル Link to this heading

ターミナルを開いたときにデフォルトで起動するshellを変更している。

{
  // Terminal
  "terminal.integrated.defaultProfile.windows": "Git Bash", // デフォルトのshellを変更
}

フォーマット Link to this heading

自動フォーマットの設定。デフォルトのフォーマッタは言語により異なるので省略。

{
  // Formatter
  "editor.formatOnSave": true, // 保存時にformatする
  "editor.formatOnType": true, // タイプ時にformatする
}
Licensed under CC BY-NC-SA 4.0
最終更新 11月 07, 2023
Hugo で構築されています。
テーマ StackJimmy によって設計されています。