コマンドラインから JavaScript のシンタックスチェックを行う方法
コマンドラインから JavaScript のシンタックスチェックを行う方法
JavaScript Advent Calendar 2010 19日目はコマンドラインで JavaScript のシンタックスのチェックについてです。
JavaScript のシンタックスエラーで悩んだ経験はありませんか？何故か特定ブラウザ(特にIEで)動かない、そんな場合はシンタックスエラーを疑うべきです。
ただし、IEのみで起きるシンタックスエラーには注意が必要です。IEの行番号は当てにならないことが多い上に、外部ファイルが複数あるときなど、どのファイルでのエラーになっているのかをIEは教えてくれません。大抵はオブジェクトリテラル( {hoge: 2, fuga: 0,} など)に余計なカンマが付いていることが原因です(IE以外のブラウザは余計なカンマを許容してしまいます*1 )から、まずカンマをチェックして、1ファイルずつ読み込んでエラーになるファイルを探し出し、さらにコメントアウトの範囲を変えてエラーになっている箇所を特定するなど、根気のいる作業が必要となります。JavaScriptのデバッグTips - os0x.blog
そんな場合は、コマンドラインから自動で JavaScript のシンタックスエラーをチェックしましょう。
SpiderMonkey でシンタックスエラーをチェック
SpiderMonkey は複数の Mozilla のプロダクトで利用されているオープンソースの JavaScript エンジンです。SpiderMonkey をインストールすると、デフォルト設定もしくはディストリビューションのパッケージのほとんどで js コマンドを利用できるようになります。
大体のディストリビューションなら、SpiderMonkey でパッケージングされていることでしょう。手動でのインストール方法は、以下のドキュメントに書いてあります。
さて、IE でシンタックスエラーを引き起こす、以下のファイルがあったとします。
var errorSyntax = {
foo: 1,
bar: 2,
}
このファイルを js -s と -s オプションをつけてコマンドラインから実行してみましょう。
$ js -s syntax_error.js
syntax_error.js:4: strict warning: trailing comma is not legal in ECMA-262 object initializers:
syntax_error.js:4: strict warning: }
syntax_error.js:4: strict warning: ^
"trailing comma is not legal in ECMA-262 object" と表示され、すぐおかしいことが解りますね。
最新の SpiderMonkey だと、ECMA 5th では, 無くて問題無いとのことで warning が消えるようになりました(との情報を後ろの席の人に教えて貰った)。1.7.1以前のバージョンをご利用下さい
より厳密にシンタックスエラーをチェックする
の jslint を利用すれば厳密なシンタックスを調査することができます。この jslint をコマンドラインから利用することも出来ますが、jslint 自体を利用するために SpiderMonkey や Rhino, node.js のラッパーが必要となります。
各種言語で利用できる、さまざまな jslint のラッパーはいくつかあります。すべてではありませんが、参照リンクを張っておきます。
- Perl
- Java
- Python
- Ruby
いくつか使ってみたところ、
で公開されているラッパーがコマンドラインから利用するにはシンプルで使いやすかったです。上記ラッパーを落として実行すると
$ ./jslint syntax_error.js
Problems:
----------------------------------------
Error:
syntax_error.js:3:9
Extra comma.
bar: 2,
syntax_error.js:4:1
Expected '}' and instead saw '}'.
};
syntax_error.js:4:1
Stopping, unable to continue. (2% scanned).
とわかりやすいメッセージで表示されます。
テストに組み込む
さて、共同開発を行っていると、誰かが(もちろん自分も含みます)うっかり JS のシンタックスエラーとなるコードをコミットしてしまいがちです。それを防ぐために、あなたのプロジェクトのテストにシンタックスエラーのチェックを入れましょう。
たとえば、Rails + RSpec2 を利用しているプロジェクトでは、以下の Spec を盛り込むことでカンマエラーを発見することが出来るでしょう。
it 'JavaScript syntax should be valid' do
path = Rails.root.join('public/javascripts').realpath.to_s
files = Dir.glob(path + '/{*.js,**/*.js}')
files.each do |file|
result = %x{js -s '#{file}' 2>&1}
result.should_not match('ECMA-262')
end
end
さて、本日の JavaScript Advent Calendar では主にコマンドラインから JS のシンタックスチェックの方法をご紹介しました。コマンドラインからシンタックスチェックが出来れば、いろいろと夢が広がりますね。たとえばエディタと組み合わせて保存したら即座にシンタックスチェック、などもできます(興味のある方は vim|emacs jslint などで検索してみてください)。なお私も以前はエディタでシンタックスエラーを保存時逐一行ってましたが、エラーになるとわかりきっている場合にも毎度エラーの警告が出るため煩わしくなって辞めてしまいましたが ;(。
