VSCodeの「実行とデバッグ」のドロップダウン順序を変更する

VisualStudioCode

概要

compoundsでクライアントとサーバー同時に起動するやつ「All (Client + Server)」をつくったので、VSCodeの「実行とデバッグ」のドロップダウン順序の一番上にしたいな(アイキャッチ参照)と思ったのですが、探し方が悪いのか検索してもなぜか出てこず、GPT4くんにもそんな方法はないよと言われたのでいまこれを書いています。

結論:compoundsで、公式に載ってるしサジェストにも出てるpresentationのorderを使う。

参考

Debugging in Visual Studio Code
One of the great things in Visual Studio Code is debugging support. Set breakpoints, step-in, inspect variables and more...

コード

configurations内でなら順番を変えるだけで移動できるんですが、compoundsはどこに書いても常に一番下になってしまうので、orderで順番を指定します。

launch.json

{
  "version": "0.2.0",
  "compounds":[
    {
      "name": "All (Client + Server)",
      "configurations": ["Client", "Server"], // まとめて起動したいconfigurationsのnameを記載
      "presentation": {
        "hidden": false,
        "group": "",
        "order": 1 //これを設定するとドロップダウンの一番上に表示される
      },
      "stopAll": true,
    },
  ],
  "configurations": [
    {
      "name": "Client", //クライアントの起動構成(configurationsは記載順が優先されます)
      "type": "node",
      "request": "launch",
      "cwd": "${workspaceFolder}/sample-client",
      "runtimeExecutable": "npm",
      "runtimeArgs": ["start"],
      "skipFiles": ["<node_internals>/**"],
      "console": "integratedTerminal",
    },
    {
      "name": "Server", //サーバーの起動構成
      "type": "node",
      "request": "launch",
      "runtimeArgs": ["-r", "ts-node/register"],
      "args": ["${workspaceFolder}/sample-server/server.ts"],
      "console": "integratedTerminal"
    },
  ],
}

おわり。