第2回 Visual Studio Codeのデバッグ構成ファイルの基本：Node.js編：特集：Visual Studio Codeデバッグ入門（3/3 ページ）

Visual Studio Codeはlaunch.jsonファイルで構成を行うことで、デバッグをさまざまに構成可能だ。Node.jsを対象に構成ファイルの取り扱いの基本を説明する。

[かわさきしんじ，Insider.NET編集部]

［Attach Program］構成でデバッグ

　まずはコンソールや統合ターミナルから「node debug bin\www」「node --debug bin\www」などのコマンドを入力して、デバッグモードでアプリを実行する。あるいはpackage.jsonファイルにデバッグ用のスクリプトを記述して、「npm run-script debug」などとしてもよい。

　例えば、以下は統合ターミナルからコマンドラインでプログラムをデバッグモードで実行しているところだ。

--debug-brkオプションを指定してプログラムを実行したところ

　そして、［デバッグ］ビューで［Attach Program］構成を選択して、［デバッグの開始］ボタンを実行する。アタッチができれば後は通常通りにデバッグを行える。

アタッチしてデバッグを行っているところ

　デバッグ用のツールバーの右端には、アタッチを解除するボタンがあるので、デバッグが終了したらこれをクリックしよう（ただし、起動したプログラムは依然として実行を続けた状態となるので注意）。

npmスクリプト経由でプログラムをデバッグ実行する

　VS Codeではnpmをランタイム環境としてデバッグを行うことも可能だ。これには、runtimeExecutable属性を指定する。例えば、package.jsonファイルに以下のようなデバッグ用スクリプトを追加し、その設定を利用してデバッガーを起動できる。ここではInspectorプロトコルを使うように指定している（デフォルトのポート番号は9229）。

{
  "name": "expressapp",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "start": "node ./bin/www",
    "debug": "node --inspect ./bin/www"
  },
  "dependencies": {
    …… 省略 ……
  }
}

Inspectorプロトコルを使用して、デバッグ実行を行う

　このとき、対応するlaunch.jsonファイルのエントリは次のようになる。

{
  "version": "0.2.0",
  "configurations": [
    {
      …… 省略 ……
    },
    {
      …… 省略 ……
    },
    {
      "type": "node",
      "request": "launch",
      "name": "Launch from npm script",
      "runtimeExecutable": "C:\\Program Files\\nodejs\\npm.cmd",
      "runtimeArgs": [
        "run-script", "debug"
      ],
      "protocol": "inspector",
      "port": 9229
    }
  ]
}

対応するlaunch.jsonファイルのエントリ
runtimeExecutable属性とruntimeArgs属性、protocol属性、port属性を指定している

　ここではruntimeExecutable属性にはnpmへのフルパスを指定している（筆者が試したところでは単に「npm」とするだけではうまくいかなかったため）。runtimeArgs属性にはnpmに与える引数を指定する。「npm run-script debug」コマンドを実行するので、ここでは"run-script"と"debug"を指定している。protocol属性にはpackage.jsonで指定した「"node --inspect ./bin/www"」に合わせて"inspector"を指定し、port属性にはInspectorプロトコルで使用するデフォルトポート番号の9229を指定している。

　この状態で、［Launch from npm script］を選択して［デバッグの開始］ボタンをクリックすれば、［デバッグ コンソール］パネルからプログラムが起動されて、デバッグ実行が開始される。

　この辺りの設定は結構面倒くさいところがあり（特にVS Codeの側でいろいろと気を使ってくれるのが、逆に分かりにくくなっているような気がする）、試行錯誤が必要になるかもしれない。うまくいかないときには、ポートとプロトコルを適切に設定できているかに注意しよう。

---

　今回はNode.jsプログラムのデバッグを行う際に、そのデバッグ構成を行う方法を見た。本稿では取り上げなかった属性もたくさんあるので、興味のある方は「Node.js Debugging in VS Code」ページや「Node.js Tutorial in VS Code」ページなどを参照されたい。

　次回はVS Codeで.NET Coreコードをデバッグするための構成などについて見ていく予定だ。

「特集：Visual Studio Codeデバッグ入門」