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

これはなに Link to this heading

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

環境 Link to this heading

  • VS Code 1.109.0

エディタの見た目(Overall Style) Link to this heading

アイコン Link to this heading

settings.json
{
  "workbench.iconTheme": "catppuccin-mocha", // icon theme
  "vsicons.dontShowNewVersionMessage": true,
}

最近の好みはCatppuccin Icons。

もちろんMaterial Iconやvscode-iconsもわかりやすい。これらを使うこともある。

カラーテーマ Link to this heading

settings.json
{
  "workbench.colorTheme": "Night Owl", // color theme
}

好みと見やすさで選んでいる。最近はNight OwlかTokyo Nightをよく使っている。

下記のテーマも好み。気分で変えることがある。

フォント Link to this heading

settings.json
{
  "editor.fontFamily": "Cica, 'Bizin Gothic', Firge, PlemolJP, Consolas, 'Yu Gothic', 'Meiryo', 'Courier New', monospace, 'Ricty Diminished'", // font
  "terminal.integrated.fontFamily": "'UDEV Gothic', 'HackGen Console', HackGen, PlemolJP, Cica", // terminal font
}

エディタのフォントはCicaを愛用している。好きなので。

Bizin Gothicも好み。そもそもInconsolataが好みなので。

ターミナルはターミナル上で読みやすいと感じたフォントを使うようにしている。最近はUDEV GothicとHackGenを行ったり来たりしている。

他に、気分で変えたくなったときにすぐ変えられるように、いくつかフォントを書いておいている。

色の調整 Link to this heading

カラーテーマを気分で変えたときに見にくくならないように、ミニマップと選択範囲の色をカスタマイズしている。これを設定してから見にくさで困らなくなった。

settings.json
{
  // Custom color
  "workbench.colorCustomizations": {
    // Minimap
    "minimapSlider.activeBackground": "#4c4d03a0",
    "minimapSlider.background": "#4c4d03a0",
    "minimapSlider.hoverBackground": "#4c4d03a0",
    // Selection
    "editor.selectionBackground": "#535029",
    "editor.findMatchHighlightBackground": "#1d5f82f0",
    "editor.findMatchBackground": "#197331"
  },
}

カーソル Link to this heading

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

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

ミニマップ Link to this heading

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

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

ファイル作成時 Link to this heading

ファイル作成時の挙動。とくに改行文字はautoにすると意図しない動作をしそうなので、明示的に指定している。環境や言語に依存するので、よくワークスペースの設定で上書きする。

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

ファイル保存時 Link to this heading

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

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

下記の拡張機能も使っている。削除の面では必要ないが、残っている空白をハイライトしてくれるのが便利。諸事情でフォーマッターを保存時に走らせられない場合とくに重宝する。

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

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

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

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

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

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

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

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

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

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

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

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

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

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

その他の細かい設定。

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

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

settings.json
{
  // Editor
  "workbench.editor.tabSizing": "shrink", // タブのサイズ
  "editor.rulers": [
    80
  ], // 80文字目に縦線を表示
  "editor.lineHeight": 1.2, // 行の高さを変更
  "editor.letterSpacing": 0.2, // 文字間のスペースを調整
  "editor.multiDocumentOccurrencesHighlight": true, // 複数のドキュメントにまたがるコードハイライト
  "workbench.editor.pinnedTabsOnSeparateRow": true, // ピン止めしたタブを別の行に表示
  "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, // インライン候補を自動表示
  "editor.inlayHints.enabled": "on", // インラインヒントを表示
  // DiffEditor
  "diffEditor.ignoreTrimWhitespace": false, // 空白文字の変更を無視しない
  // Suggestion
  "editor.acceptSuggestionOnEnter": "off", // Enterで予測候補が入力されないようにする
  "editor.suggestSelection": "first", // 最初の候補を選択
  // Debug
  "debug.inlineValues": "on", // デバッグ中に行内に変数値を表示
  // File reading
  "files.readonlyInclude": {
    "node_modules": true,
    ".git": true
  },
}

Gitの挙動 Link to this heading

autofetchを有効にすることでpullし忘れを防いでいる(まあ忘れるときは忘れる)。また、GitHubを使うことが多いので、プロトコルをsshに変更している。

署名付きコミットを使っている場合は他のツールも署名付きコミットを使うように設定する。

settings.json
{
  // Git
  "git.autofetch": "all", // 自動fetchをON
  "github.gitProtocol": "ssh", // gitのプロトコルをsshに変更
  "git.enableCommitSigning": true,
  "git-graph.repository.sign.commits": true,
  "gpgIndicator.enablePassphraseCache": true,
}

Git関連で使っている拡張機能は下記のとおり。

GitHubのPRをよく使うプロジェクトだと下記も使う。

署名付きコミットを使う場合で、かつdevcontainerを使っている場合は、下記の拡張機能でgpgキーのパスをキャッシュしている。これは自己責任で。

GitHub Copilotの挙動 Link to this heading

この設定は暫定。アップデートが激しい。

GitHub Copilotの設定(暫定)

settings.json
{
  // Github Copilot
  "chat.agent.enabled": true,
  "github.copilot.nextEditSuggestions.enabled": true,
  "github.copilot.chat.commitMessageGeneration.instructions": [
    {
      "file": ".github/instructions/commit-message.instruction.md"
    },
    {
      "text": "You must write in English."
    }
  ],
  "github.copilot.enable": {
    "*": true,
    "plaintext": true,
    "markdown": true,
    "scminput": false
  },
  "chat.tools.terminal.autoApprove": {
    "cd": true,
    "ls": true,
    "find": true,
    "head": true,
    "type": true,
    "mkdir": true,
    "touch": true,
    "/^uv\\s+--version$/": true,
    "/^uv\\s+init\\b/": true,
    "/^uv\\s+venv\\b/": true,
    "/^uv\\s+python\\s+pin\\b/": true,
    "/^uv\\s+add\\b/": true,
    "/^uv\\s+remove\\b/": true,
    "/^uv\\s+run\\b/": true,
    // False commands
    "rm": false,
    "del": false,
    "git": false,
  },
  "chat.tools.urls.autoApprove": {
    "https://raw.githubusercontent.com/github/gitignore/main/Python.gitignore": {
      "approveRequest": false,
      "approveResponse": true
    }
  },
}

拡張機能を入れる必要がある。

リモート接続 Link to this heading

ポートを自動で転送するようにしている。

settings.json
{
  // Remote
  "remote.autoForwardPortsSource": "hybrid",
}

リモート関連の機能については、下記の拡張機能パッケージを入れておけばたいてい問題ない。

devcontainerを使うときはDockerfileも書くことがあるので、Dockerの拡張機能も入れている。

ターミナル Link to this heading

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

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

フォーマット Link to this heading

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

settings.json
{
  // Formatter
  "editor.formatOnSave": true, // 保存時にformatする
  "editor.formatOnType": true, // タイプ時にformatする
}

言語ごとの設定 Link to this heading

Markdown Link to this heading

テキスト、とくにマークダウンは一番書くといっても過言ではない。そのため色々設定している。

settings.json
{
  // Markdown
  "textlint.autoFixOnSave": false,
  "[markdown]": {
    "editor.tabSize": 4,
    "editor.suggest.showWords": false,
    "editor.wordWrap": "on",
    "editor.quickSuggestions": {
      "comments": "on",
      "strings": "on",
      "other": "on",
    },
    "editor.snippetSuggestions": "top",
    "editor.defaultFormatter": "yzhang.markdown-all-in-one",
    "editor.unicodeHighlight.nonBasicASCII": false,
  },
  "markdown.preview.breaks": false,
  "markdown.preview.fontFamily": "'Yu Gothic','Meiryo', -apple-system, BlinkMacSystemFont, 'Segoe WPC', 'Segoe UI', system-ui, 'Ubuntu', 'Droid Sans', sans-serif",
  "markdownlint.config": {
    "MD007": false,
    "MD010": false,
    "MD025": false,
    "MD026": false,
    "MD033": false,
  },
  "markdown.extension.list.indentationSize": "inherit",
  "markdown.extension.orderedList.marker": "one",
  "markdown.extension.toc.orderedList": true,
  "markdown.extension.toc.levels": "2..6",
  "markdown.extension.toc.updateOnSave": false,
  "markdown-preview-enhanced.hideDefaultVSCodeMarkdownPreviewButtons": false,
  "markdown-preview-enhanced.mermaidTheme": "forest",
  "markdown-preview-enhanced.breakOnSingleNewLine": false,
  "markdown-pdf.styles": [
    "VSCode_mdPreview.css",
  ],
  "markdown.marp.html": "all",
}

マークダウン関連で使っている拡張機能は結構多い。下記は必須級。

下記は必須ではないが、見出しのずれに気づけるので便利。

画像の貼り付けはPaste Imageを使っている。WSL環境でも動作するので便利。

読みやすい文章を書くためにチェックツールも使っている。

マークダウンすら知らない人に渡すとき、あるいは文書改ざんを防ぎたいときはPDFにしている。

Marpを使うときは下記を入れる。

プレーンテキスト Link to this heading

settings.json
{
  // Plain text
  "[plaintext]": {
    "editor.suggest.showWords": false
  },
}

JSON/JSONC Link to this heading

フォーマットの設定だけ。

settings.json
{
  // JSON
  "[json]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[jsonc]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
}

Python Link to this heading

settings.json
{
  // Python settings
  "[python]": {
    "editor.tabSize": 4,
    "editor.wordBasedSuggestions": "off",
    "editor.defaultFormatter": "charliermarsh.ruff",
  },
  "python.analysis.inlayHints.callArgumentNames": "all",
  "python.analysis.inlayHints.functionReturnTypes": true,
  "python.analysis.inlayHints.variableTypes": true,
  "python.analysis.inlayHints.pytestParameters": true,
  "flake8.args": [
    "--ignore=E203,W503,E704",
    "--max-line-length=80"
  ],
  "notebook.cellToolbarLocation": {
    "default": "right",
    "jupyter-notebook": "left"
  },
  "python.analysis.typeCheckingMode": "strict",
  "python.analysis.diagnosticSeverityOverrides": {
    "reportMissingImports": "error",
    "reportMissingSuperCall": "error",
    "reportMissingParameterType": "error",
    "reportMissingModuleSource": "error",
    "reportMissingTypeArgument": "error",
    "reportMissingTypeStubs": "information",
  },
}

最近は基本的にruffを使っているので、flake8の設定は昔の設定だが、念のため残してある。また、プロジェクトにpyrightconfig.jsonを設定していることが多いので、一部の設定はたいていpyrightconfig.jsonで上書きしている。

Pythonの拡張機能は必須。

Mypyも基本的に使っている。

ドキュメントをきちんと書くときはプレビューツールも使う。

C++ Link to this heading

フォーマットスタイルの指定をしている。

settings.json
{
  "C_Cpp.clang_format_style": "{ BasedOnStyle: LLVM, AccessModifierOffset: -4, BreakBeforeBraces: Attach, IndentWidth: 4, PointerAlignment: Left }",
  "liveServer.settings.donotShowInfoMsg": true,
}

Web関連 Link to this heading

Auto close tagに変わる設定と、Auto rename tagに変わる設定を有効にしている。

settings.json
{
  // Auto close tag
  "html.autoClosingTags": true,
  "javascript.autoClosingTags": true,
  "typescript.autoClosingTags": true,
  // Auto rename tag
  "editor.linkedEditing": true,
  // Web related
  "[html]": {
    "editor.tabSize": 2,
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[css]": {
    "editor.tabSize": 2,
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[scss]": {
    "editor.tabSize": 2
  },
  "javascript.updateImportsOnFileMove.enabled": "never",
  "[javascript]": {
    "editor.tabSize": 2,
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "typescript.updateImportsOnFileMove.enabled": "never",
  "[typescript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode",
  },
  "[typescriptreact]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode",
  },
}

大抵はESLintとPrettierを使う。もちろんNext.jsやVue.jsなどのフレームワーク固有の設定もプロジェクトごとに行っている。

Highlight Matching Tagも便利。

たまにプレビュー機能も使う。下記のどちらがより良いのかはよくわかっていない。

SVGを使うときは、拡張機能をいれてプレビューできるようにしている。

ただ、これはダークテーマと相性が悪いので、設定も追加している。

settings.json
{
  // SVG Preview
  "svgPreview.autoOpen": false,
  "svgPreview.style": {
    "html": {
      "background": "white"
    }
  },
}

LaTeX Link to this heading

最近はマークダウンから変換しているので全然書いていない。だからこの設定も古いままだと思われる。参考まで。

タイトル

settings.json
{
  "[latex]": {
    "editor.wordWrap": "on",
    "editor.wordSeparators": "./\\()\"'-:,.;<>~!@#$%^&*|+=[]{}`~?.。,、()「」[]{}《》てにをはがのともへでや",
    "editor.suggestSelection": "recentlyUsedByPrefix",
    "editor.suggest.snippetsPreventQuickSuggestions": false,
    "editor.quickSuggestions": {
      "other": true,
      "comments": false,
      "strings": false
    },
    "editor.tabSize": 2
  },
  "[tex]": {
    "editor.suggest.snippetsPreventQuickSuggestions": false,
    "editor.tabSize": 2
  },
  "[bibtex]": {
    "editor.tabSize": 2
  },
  "latex-workshop.latex.autoBuild.run": "never",
  "latex-workshop.intellisense.package.enabled": true,
  "latex-workshop.view.pdf.viewer": "tab",
  "latex-workshop.docker.enabled": false,
  "latex-workshop.docker.image.latex": "latexindent",
  "latex-workshop.latex.outDir": "./latex-output",
  "latex-workshop.view.pdf.zoom": "page-width",
  "latex-workshop.latex.recipe.default": "lastUsed",
  "latex-workshop.latex.autoClean.run": "onFailed",
  "latex-workshop.latex.clean.fileTypes": [
    "*.aux",
    "*.bbl",
    "*.blg",
    "*.idx",
    "*.ind",
    "*.lof",
    "*.lot",
    "*.out",
    "*.toc",
    "*.acn",
    "*.acr",
    "*.alg",
    "*.glg",
    "*.glo",
    "*.gls",
    "*.ist",
    "*.fls",
    "*.fdb_latexmk",
    "*_minted*",
    "*.snm",
    "*.nav",
    "*.vrb",
    "*.dvi",
    "*.synctex.gz",
    "*.bcf", // ADD
    "*.run.xml" // ADD
  ],
  "latex-workshop.latex.recipes": [
    {
      "name": "LuaLaTeX with BibLaTeX",
      "tools": [
        "lualatex_non-synctex",
        "biblatex",
        "lualatex_non-synctex",
        "lualatex"
      ]
    },
    {
      "name": "LuaLaTeX",
      "tools": ["lualatex_non-synctex", "lualatex"]
    }
  ],
  "latex-workshop.latex.tools": [
    {
      // LuaLaTeX non-SyncTeX mode
      "name": "lualatex_non-synctex",
      "command": "lualatex",
      "args": [
        "-interaction=nonstopmode",
        "-file-line-error",
        "-halt-on-error",
        "--output-directory=%OUTDIR%",
        "%DOC%"
      ]
    },
    {
      // LuaLaTeX
      "name": "lualatex",
      "command": "lualatex",
      "args": [
        "-synctex=1",
        "-interaction=nonstopmode",
        "-file-line-error",
        "-halt-on-error",
        "--output-directory=%OUTDIR%",
        "%DOC%"
      ]
    },
    {
      // BibLaTeX
      "name": "biblatex",
      "command": "biber",
      "args": [
        "%DOCFILE%",
        "--bblencoding=utf8",
        "-u",
        "-U",
        "--output_safechars",
        "--output-directory=%OUTDIR%"
      ]
    }
  ],
}

拡張機能特有の設定 Link to this heading

Highlight Link to this heading

任意の用語をハイライトするのに使っている拡張機能。主に読みやすい日本語を書くために直したほうが良い表現をハイライトしている。

Highlightの設定(長いので畳む)

settings.json
{
  // Highlight
  "highlight.regexes": {
    // URL強調
    "(https?|ftp)(://[-_.!~*\\'()a-zA-Z0-9;/?:\\@&=+\\$,%#]+)": [
      {
        "color": "#9FA8DA"
      },
      {
        "color": "#9FA8DA"
      }
    ],
    // 全角英数字
    "([0-9A-Z])": [
      {
        "backgroundColor": "#455A64",
        "color": "#C62828"
      }
    ],
    // 二重否定強調(参考:https://qiita.com/azu/items/60764ed6f415d3c748bf)
    "(なくはない|なくはありません|ないでもない|ないでもありません|ないものではない|ないものではありません|ないことはない|ないことはありません|ないわけではない|ないわけではありません|ないとはいいきれない|ないとはいいきれません|ないとはかぎらない|ないとはかぎりません)": [
      {
        "backgroundColor": "#455A64",
        "color": "#C62828"
      }
    ],
    // 冗長表現(害悪)1
    "(ことが可能|ことも可能|ことができ|こともでき|ことはでき|可能で|可能と)": [
      {
        "backgroundColor": "#455A64",
        "color": "#C62828"
      }
    ],
    // 冗長表現(害悪)2
    "(を行う|を行います|を行った|を行いました|を行える|を行って|を行った|ことによって|ことにより|となって|させること|おいては|ということ)": [
      {
        "backgroundColor": "#455A64",
        "color": "#C62828"
      }
    ],
    // 二重表現
    "(一番最初|まずはじめ|まず、はじめ|まず初|まず、初|まず最初|まず、最初|では次に|では、次に|必ず必要|必ず、必要)": [
      {
        "backgroundColor": "#455A64",
        "color": "#C62828"
      }
    ],
    // 冗長表現(害悪)3
    "(その結果として|する方法で|するのです|いますので|いますため)": [
      {
        "backgroundColor": "#455A64",
        "color": "#C62828"
      }
    ],
    // 口語表現
    "(なんか|。なので|にて|なのか|なんて|といった|こっち|そっち|どっち|ちゃんと|でも、|だけど|けど|やっぱり|とっても|いっぱい|なきゃ|じゃなくて|じゃない|すごく|から、|全然|いろんな|だったりする|だったりします|一応|こんな|やっと)": [
      {
        "backgroundColor": "#455A64",
        "color": "#C62828"
      }
    ],
    // よく間違える表現
    "(づつ)": [
      {
        "backgroundColor": "#455A64",
        "color": "#C62828"
      }
    ],
    // 言い回しをどうにかしろ
    "(なのだといえ|なのだと言え|であるといえ|であると言え|であるから)": [
      {
        "backgroundColor": "#455A64",
        "color": "#C62828"
      }
    ],
    // 冗長表現(減らしたほうが良い)
    "(という|こと|ので|ため|また、|したがって、|よって、|ゆえに、|ようにする)": [
      {
        "color": "#C0CA33"
      }
    ],
    // 弱い表現
    "(と考えられる|と考えられます|かもしれない|かもしれません|と思う|と思います|と思われる|と思っている|と思われます|きっと|であろう|でしょう|のようである|のようです|と見ても良い|と見てもよい|と見てもいい|とみても良い|とみてもよい|とみてもいい|ほぼ|ような|らしい|みたいな|な感じ|かな|的に|的な)": [
      {
        "backgroundColor": "#1A237E"
      }
    ],
    // 「ら」抜き、「い」抜き言葉
    "(通してる|行ってる|見れ|食べれ|着れ|考えれ)": [
      {
        "backgroundColor": "#1A237E"
      }
    ],
    // 2文に分けられるのでは?
    "(し、|であり、|して、|だが、|ですが、|せず、|おらず、|なく、)": [
      {
        "backgroundColor": "#827717"
      }
    ],
    // 曖昧接続詞
    "(あり、|おり、|が、|き、|し、|て、|く、|ず、|で、)": [
      {
        "backgroundColor": "#827717"
      }
    ],
    // 言い換えられるのでは?
    "(になります|になる|の方|のほう|中で、|されてくる|に対して)": [
      {
        "backgroundColor": "#004D40"
      }
    ],
    // ひらがなにしよう!1
    "(沢山|共に|出来る|出来た|出来て|出来な|下さい|更に|暫く|既に|偶に|時々|及び|且つ|但し|尚|並びに|又は|全て|初めに|始めに|分かる|分から|分かっ)": [
      {
        "color": "#E65100"
      }
    ],
    // ひらがなにしよう!2(参考:https://github.com/lostandfound/textlint-rule-ja-hiragana-keishikimeishi)
    "(る上|た上|の上|る事|た事|の事|る度|た度|の度|る方|た方|の方|る時|た時|の時|る毎|た毎|の毎|る為|た為|の為|る訳|た訳|の訳|る所|た所|の所|る通り|た通り|の通り|る物|た物|の物|る他|た他|の他)": [
      {
        "color": "#E65100"
      }
    ],
    // ひらがなにしよう!3
    "(為|致します|無い|頂き|頂く|等|如何|何時も|何故|所謂|乍ら|様々な|然し|若し|次第|是非|度々|取り敢えず|前以て|前以って|先ず|殆ど|し易い|の様に|以下の通り)": [
      {
        "color": "#E65100"
      }
    ],
    // 目標設定用
    "(DONE)": [
      {
        "color": "#00897B"
      }
    ],
    "(DELAY|INCOMPLETE)": [
      {
        "color": "#C62828"
      }
    ],
    "(PENDING)": [
      {
        "color": "#827717"
      }
    ],
    "(NOW)": [
      {
        "color": "#E65100"
      }
    ],
    "(PROBLEM)": [
      {
        "backgroundColor": "#C62828",
        "color": "#E0F2F1"
      }
    ],
    "(FUTURE)": [
      {
        "color": "#59bae0"
      }
    ]
  },
}

Todo Tree Link to this heading

重要度に合わせて色を付けている。タグにコロンを付けないと反応しないようにしている。

Todo Treeの設定(長いので畳む)

settings.json
{
  "todo-tree.general.debug": true,
  "todo-tree.general.tags": [
    "BUG:", // 動かない
    "XXX:", // 動くがなぜ動くかわからない
    "FIXME:", // 既知の不具合があり、修正が必要
    "TODO:", // 追加/修正するべき機能がある
    "REVIEW:", // 意図したとおりに動くか要確認
    "WARNING:", // 注意
    "OPTIMIZE:", // ボトルネックになっている
    "HACK:", // あまりきれいではなく、リファクタリングが必要
    "CHANGED:", // コードをどのように変更したかのメモ
    "NOTE:" // メモ
  ],
  "todo-tree.regex.regex": "((//|#|<!--|;|/\\*|^)\\s*($TAGS)|^//\\s*\\[x\\]|^//\\s*\\[ \\])",
  "todo-tree.highlights.defaultHighlight": {
    "type": "text-and-comment",
    "icon": "alert",
    "foreground": "#00897B",
    "background": "#E0F2F1",
    "iconColour": "#00897B",
    "gutterIcon": true,
  },
  "todo-tree.highlights.customHighlight": {
    "BUG:": {
      // 動かない
      "icon": "bug",
      "background": "#ffcdd2",
      "foreground": "#d32f2f",
      "fontWeight": "bold",
      "iconColour": "#e53935"
    },
    "XXX:": {
      // 動くけどなぜ動くか分からないやべー奴
      "icon": "x-circle-fill",
      "background": "#ffcdd2",
      "foreground": "#d32f2f",
      "fontWeight": "bold",
      "iconColour": "#e53935"
    },
    "FIXME:": {
      // 既知の不具合があり、修正が必要
      "icon": "flame",
      "background": "#ffcdd2",
      "foreground": "#d32f2f",
      "fontWeight": "bold",
      "iconColour": "#e53935"
    },
    "TODO:": {
      // 追加/修正するべき機能がある
      "icon": "tools",
      "foreground": "#33691E",
      "background": "#DCEDC8",
      "iconColour": "#81C784"
    },
    "REVIEW:": {
      // 意図したとおりに動くか要確認
      "icon": "eye",
      "foreground": "#E65100",
      "background": "#FFE0B2",
      "iconColour": "#F57C00"
    },
    "WARNING:": {
      // 注意
      "icon": "alert",
      "foreground": "#E65100",
      "background": "#FFE0B2",
      "iconColour": "#F57C00"
    },
    "OPTIMIZE:": {
      // ボトルネックになっている
      "icon": "hourglass",
      "foreground": "#E65100",
      "background": "#FFE0B2",
      "iconColour": "#F57C00"
    },
    "HACK:": {
      // あまりきれいではなく、リファクタリングが必要
      "icon": "pin",
      "foreground": "#E65100",
      "background": "#FFE0B2",
      "iconColour": "#F57C00"
    },
    "CHANGED:": {
      // コードをどのように変更したかのメモ
      "icon": "issue-reopened",
      "foreground": "#1A237E",
      "background": "#C5CAE9",
      "iconColour": "#F9A825"
    },
    "NOTE:": {
      // メモ
      "icon": "pencil",
      "hideFromTree": true
      //"gutterIcon": false,
    }
  },
}

VSNotes Link to this heading

デフォルトのパスと、作成されるファイル名のフォーマットを設定している。

VSNotesの設定

settings.json
{
  // VSNotes
  "vsnotes.defaultNotePath": "path/to/VSNotes",
  "vsnotes.tokens": [
    {
      "type": "datetime",
      "token": "{dt}",
      "format": "YYYYMMDD",
      "description": "Insert formatted datetime."
    },
    {
      "type": "title",
      "token": "{title}",
      "description": "Insert note title from input box.",
      "format": "Untitled"
    },
    {
      "type": "extension",
      "token": "{ext}",
      "description": "Insert file extension.",
      "format": "md"
    }
  ],
}

その他の拡張機能 Link to this heading

優先度高 Link to this heading

パスの候補を表示する拡張機能。これがあるだけで手間が格段に減る。

スペルチェックの拡張機能。タイプミスにも気づけるので、プログラミングには必須。

エラーをエディタ上に表示してくれる拡張機能。毎回ターミナルの問題を読まずに済む。

インデントに色を付ける拡張機能。Pythonを読み書きするときはないと困る。重いらしいが、個人的には気になったことはない。

優先度中 Link to this heading

カラーコードを書くとその色でハイライトしてくれる拡張機能。意外とカラーコードを書くことはあるので、書いている最中に色を確認できるのは便利。標準のハイライトよりもわかりやすくて好き。

日本語にする拡張機能。日本語にしたいときは日本語にしている。

音声ファイルの詳細をVS Codeで確認できる拡張機能。音声処理をするときに非常に便利。

優先度低 Link to this heading

VS CodeでPDFを見れるようにする拡張機能。とくにLaTeXで文章を書くとき確認で使う。

マークダウンで文章を書いているときにどういう画像が貼られているかをプレビューする拡張機能。そんなに使わないが、あると便利なこともある。

CSVファイルを見やすくする拡張機能。そんなに使わないが、あると便利なこともある。

右下に猫を飼える。

Licensed under CC BY-NC-SA 4.0
最終更新 2月 11, 2026
Hugo で構築されています。
テーマ StackJimmy によって設計されています。