JavaScriptの圧縮・難読化、エラーではまる

 JavaScriptのコードを書く。最終的な公開に向けて、コメントを削除するのが面倒。そこで、圧縮ツールというか難読化ツールを使う。圧縮したらエラーが出てはまったのでメモ。
 コード中には見られたくないものもあるので、難読化ありも含むのがいいかな。ということで、packet for .NETを使っている。それに至った経緯は忘れた。
 で、それで圧縮するとエラーが出てちゃんと動作しない。圧縮ツールのコマンドラインではなんらメッセージは出ない(そりゃそうか)。ブラウザで動かすとダメ、という感じ。
 セミコロンが抜けてたりするとアウト、という記事を見つけたので一生懸命探す。見つからない。ループの最後の「}」のあとにもつけろ、みたいなのもあったので、それも試したり(普通はいらないはずなんだがなあ、と思いつつ。なお、関数の定義の最後も不要。しかし、式で代入する場合とかはだめ。。これも見逃しがち)。でもだめ。
 そこで、文法チェックみたいなやつがないか? HTML LintのJS版みたいな。そしたら普通にあった。そりゃあるわな。
 JSLint,The JavaScript Code Quality Toolはてなブックマーク - JSLint,The JavaScript Code Quality Tool
 コードつっこむ。エラーだらけ。おもに、インデントが問題になっていると思われ。まあ、それは無視して。こまかく見ていくと、セミコロンの抜けが1カ所あった。あらら。普通に見逃してただけか。しかもだいぶ最初のほうだ。
 ということで、問題解決。
 ほかにも「こうしたほうがいい」というメッセージが出るので、それに沿っていろいろ修正。で、やっぱり「}」のあとのセミコロンは不要ということが判明。あらら。
 もう少し、JSLintについて調べる。


 長いコードで、エラーが多いと途中で止まってしまう模様。Scan stoppedとか言われる。ページに下にあるオプションを設定すると、一部のチェックをしないという。インデント関連の空白の数をチェックしているのが「messy white space」というやつ。チェックボックスでtrueにすればよい模様。これらのぽうションについては詳しい日本語の解説があった。
 JSLint|もっこりJavaScript|ANALOGIC(アナロジック)はてなブックマーク - JSLint|もっこりJavaScript|ANALOGIC(アナロジック)
 ありがとうございます。ということで、一歩前進。まだまだ先があるのだ。続く。
(追記)
 その後、もう1つ同種のチェック用サイトを発見。
 JSHint, a JavaScript Code Quality Toolはてなブックマーク - JSHint, a JavaScript Code Quality Tool
 こっちのほうが、よりカンタンな気がします。とりあえず、セミコロンの確認ならこっちでよさそう。途中でチェックをやめるみたいなこともなさそうですし。

コメント

  1. tonytong より:

    JavaScriptの圧縮・難読化 http://www.online-code.net/minify-js.html

タイトルとURLをコピーしました