概要
Vagrant上のNode.jsをホストOS上のChromeの開発者ツールを使ってデバッグする。
環境
- Mac OS X Sierra 10.12.6
- Vagrant 2.0.0
- OSイメージ Amazon Linux
手順
1.デバッグモードで起動(ゲストOS)
デバッガーがポート9229番(デフォルト)で起動します。
$ node --inspect app.js
Debugger listening on ws://127.0.0.1:9229/27c2d3d8-b74a-4aac-8bd7-73723c0d0343
For help see https://nodejs.org/en/docs/inspector
ホストマシンからVarantのポート番号9229へのアクセスを可能とすることで、
Chromeの開発ツールからデバッグできるように設定します。
2.ポートフォワーディング設定(ホストOS)
ホストOSのポート9229番と、ゲストOSのポート9229番を接続します。
Vagrantfile
config.vm.network :forwarded_port, guest: 9229, host: 9229
Vagrantをリロードします。
$ vagrant reload
3.ポートを開ける(ゲストOS)
$ sudo iptables -A INPUT -p tcp --dport 9229 -j ACCEPT
4.Google ChromeのdevToolsの設定(ホストOS)
Google Chromeのアドレスバーに chrome://inspect
と入力します。
以下のような画面が表示されます。
Configure...
から、ゲストOSに接続するIPアドレスとポート番号9229を設定します。
上記では、IPアドレス:192.168.33.100、ポート番号:9229を設定しています。
IPアドレスはVagrantfileを確認してください。
Vagrantfile
config.vm.network "private_network", ip: "192.168.33.100"
5.Debuggerを起動
IPアドレスとポート番号を指定して、デバッグを実行します。
$ node --inspect=192.168.33.100:9229 app.js
chrome://inspect
を入力すると、以下のように表示されます。
inspect のリンクを開くとデバッグがDebuggerが起動します。