小さい頃はエラ呼吸

いつのまにやら肺で呼吸をしています。


node.jsのデバッグ(ステップ実行)ができるnode-inspectorの使い方

node.js MacBook

2013.01.27追記

最新版で動作するよう記事を修正しました。

はじめに

この記事では、Mac OS X Lion上にnode-inspectorとnode.jsをインストールし、node.jsをデバッグ（ステップ実行）する手順について書いています。
この記事を書くにあたり、以下のエントリを参考にさせていただきました。

はじめてのNode.js -サーバーサイドJavaScriptでWebアプリを開発する-
はじめてのNode.js -サーバーサイドJavaScriptでWebアプリを開発する-
posted with amazlet at 14.01.23
松島 浩道
ソフトバンククリエイティブ
売り上げランキング: 13,297
Amazon.co.jpで詳細を見る

node-inspector

node-inspectorは、サーバサイドのJavaScriptをブラウザ上（Webkit系のブラウザ）でデバッグできるようにしてくれるライブラリです。

node-inspectorってのがあって、これがあると
chrome上（webkit系ならいけるらしい）でクライアントサイドのjsデバッグみたいに
サーバサイドのjsもデバッグできる。
でもnode.js0.3以上がないと動かないので注意。
node.jsでのデバッグ方法 - すにぺっと はてなブックマーク - node.jsでのデバッグ方法 - すにぺっと

動作環境
  • Mac OS X Lion
  • node.js 0.8.18
  • npm@1.1
  • node-inspector@0.2.0beta3
  • Google Chrome 24.0.1312.56
node.jsのインストール

node.jsのインストールに関しては、こちらのエントリを参照してください。

npmのインストール

node.jsのパッケージ管理システムnpmをインストールします。

sudo curl https://npmjs.org/install.sh | sudo sh
node-inspectorのインストール

npmを使ってnode-inspectorをインストールします。現在の最新版である0.1.10を入れてみます。

sudo npm install -g node-inspector

>node-inspector@0.2.0beta3 /usr/local/lib/node_modules/node-inspector
>├── async@0.1.22
>├── connect@1.8.7 (mime@1.2.9, formidable@1.0.11, qs@0.5.3)
>└── socket.io@0.9.13 (base64id@0.1.0, policyfile@0.0.4, redis@0.7.3, socket.io-client@0.9.11)
サンプルコードを用意する

以下のコードをhelloworld.jsという名前で任意のフォルダにコピーします。

var http = require('http');
http.createServer(function (req, res) {
  res.writeHead(200, {'Content-Type': 'text/plain'});
  res.end('Hello World\n');
}).listen(1337, "127.0.0.1");
console.log('Server running at http://127.0.0.1:1337/');
node-inspectorの起動

以下のコマンドでnode-inspectorが起動します。

node-inspector

>   info  - socket.io started
>visit http://0.0.0.0:8080/debug?port=5858 to start debugging
node.jsをデバッグモードで動かす

ターミナルをもう1枚起動して、node.jsをデバッグモードで起動します。このとき、カレントディレクトリはhelloworld.jsを格納したディレクトリにします。

node --debug helloworld.js 
>debugger listening on port 5858
>Server running at http://127.0.0.1:1337/
デバッグしてみる

1. Google Chromeを起動して、http://0.0.0.0:8080/debug?port=5858にアクセスします。Google ChromeのInspectorが起動するので、さきほど作成したhelloworld.jsを選択します。

2. helloworld.js内にブレークポイントを設定します。行番号のあたりをクリックするとブレークポイントが設定できます。
3. Google Chromeのタブをもう1枚開き、http://127.0.0.1:1337/にアクセスします。すると、1枚目のタブでスクリプトがブレークポイントでストップして、ステップ実行することができるようになります。

関連エントリ