はじめに

諸事情で複数の開発環境を使い分ける必要があり、環境ごとにVisual Studio Codeの設定を合わせるのが面倒。なので、設定を使い回せるように、自分のVisual Studio Codeの設定をメモしておく。

settings.json

{
    "editor.fontFamily": "'MS Gothic'",
    "editor.fontSize": 18,

    "editor.renderWhitespace": "all",
    "workbench.colorCustomizations": {
        "editorWhitespace.foreground": "#004000"
    },

    "files.autoGuessEncoding": true,
    
    "[plaintext]": {
        "editor.detectIndentation": false,
        "editor.insertSpaces": false,
        "editor.comments.insertSpace": false
    }
}

画面イメージは以下のようになる。

フォント

Windowsではデフォルトだと等幅フォントではないので、MS Gothicに変更する。また、フォントサイズはデフォルト14だが、少し大きめに18にしておく。

{
    "editor.fontFamily": "'MS Gothic'",
    "editor.fontSize": 18,

    (略)
}

ちなみに、複数のフォントを指定すると、フォントが見つからない場合にCSSの仕様に従って(?)順にフォールバックしていくらしい。

How to change fonts in VSCode?
- https://stackoverflow.com/questions/47948040/how-to-change-fonts-in-vscode

空白の表示

空白を可視化しておくと、半角スペースのつもりで全角スペースだったとか、タブにしたかったのに空白に変換されていたとか、そういったミスを減らせる。

{
    (略)
    "editor.renderWhitespace": "all",
    "workbench.colorCustomizations": {
        "editorWhitespace.foreground": "#00B000"
    },
    (略)
}

文字コードの自動識別

大抵はUTF 8を使っているが、時々Shift JISも使うので、文字コードの自動識別を有効化しておく。

{
    (略)
    "files.autoGuessEncoding": true,
    (略)
}

テキストファイルでのタブの入力

テストデータをテキストファイルに書いておくことがあるので、そういう場合はタブを勝手にスペースに変換されると困る。言語plaintextでタブを入力できるようにしておく。

{
    (略)
    "[plaintext]": {
        "editor.detectIndentation": false,
        "editor.insertSpaces": false,
        "editor.comments.insertSpace": false
    }
}

ちなみに、どの言語にも紐付けられていない拡張子を持つファイルは「plain text」になるようだ。言語個別の設定方法の詳細は以下に説明がある。