Closure Compilerを利用するワンライナーとサービス

Automator コマンド

前回からの続き。

その後、JavaScriptを圧縮・整形するコマンドjs-compile.rbを何度か使っているうちに、あることに気付いた。js-compile.rbにオプション指定の選択肢はあるのだけど、自分が使う条件はたった3種類しかない。

  • --compilation_level=WHITESPACE_ONLY
  • --compilation_level=SIMPLE_OPTIMIZATIONS
  • --compilation_level=WHITESPACE_ONLY --pretty_print

現状の自分の使い方では、上記のオプション指定だけで足りてしまう。ならば、わざわざオプション解析するコマンドなんか作らなくても、Rubyのワンライナーで足りてしまうのではないか？そう思って、さっそく試してみた。

1行コマンド

  • --compilation_level=WHITESPACE_ONLY
ruby -r net/http -r uri -e "puts Net::HTTP.post_form(URI('http://closure-compiler.appspot.com/compile'),js_code:URI.decode(STDIN.gets(nil)),compilation_level:'WHITESPACE_ONLY',output_format:'text',output_info:'compiled_code').body"
  • --compilation_level=SIMPLE_OPTIMIZATIONS
ruby -r net/http -r uri -e "puts Net::HTTP.post_form(URI('http://closure-compiler.appspot.com/compile'),js_code:URI.decode(STDIN.gets(nil)),compilation_level:'SIMPLE_OPTIMIZATIONS',output_format:'text',output_info:'compiled_code').body"
  • --compilation_level=WHITESPACE_ONLY --pretty_print
ruby -r net/http -r uri -e "puts Net::HTTP.post_form(URI('http://closure-compiler.appspot.com/compile'),js_code:URI.decode(STDIN.gets(nil)),compilation_level:'WHITESPACE_ONLY',output_format:'text',output_info:'compiled_code',formatting:'pretty_print').body"


できた、できた、これで十分である。

Aliasにしておく

  • さすがに毎回入力するには長過ぎて手間なので、aliasに設定しておくことにした。
alias js-white="ruby -r net/http -r uri -e \"puts Net::HTTP.post_form(URI('http://closure-compiler.appspot.com/compile'),js_code:URI.decode(STDIN.gets(nil)),compilation_level:'WHITESPACE_ONLY',output_format:'text',output_info:'compiled_code').body\""

alias js-simple="ruby -r net/http -r uri -e \"puts Net::HTTP.post_form(URI('http://closure-compiler.appspot.com/compile'),js_code:URI.decode(STDIN.gets(nil)),compilation_level:'SIMPLE_OPTIMIZATIONS',output_format:'text',output_info:'compiled_code').body\""

alias js-pretty="ruby -r net/http -r uri -e \"puts Net::HTTP.post_form(URI('http://closure-compiler.appspot.com/compile'),js_code:URI.decode(STDIN.gets(nil)),compilation_level:'WHITESPACE_ONLY',output_format:'text',output_info:'compiled_code',formatting:'pretty_print').body\""
  • 以下のコードをコピーして...
javascript:
(function(d,f,s){
  s=d.createElement('script');
  s.src='//crypto-js.googlecode.com/svn/tags/3.1.2/build/rollups/aes.js';
  s.onload=function(){f()};/* <---onload属性を追加 */
  d.body.appendChild(s);

  f=function(){
    /* 内部コード */
    alert(typeof CryptoJS);
    alert(CryptoJS.AES.encrypt('hello','1234'));
  };
})(document)

$ pbpaste | js-white
javascript:(function(d,f,s){s=d.createElement("script");s.src="//crypto-js.googlecode.com/svn/tags/3.1.2/build/rollups/aes.js";s.onload=function(){f()};d.body.appendChild(s);f=function(){alert(typeof CryptoJS);alert(CryptoJS.AES.encrypt("hello","1234"))}})(document);

$ pbpaste | js-simple
(function(b,c,a){a=b.createElement("script");a.src="//crypto-js.googlecode.com/svn/tags/3.1.2/build/rollups/aes.js";a.onload=function(){c()};b.body.appendChild(a);c=function(){alert(typeof CryptoJS);alert(CryptoJS.AES.encrypt("hello","1234"))}})(document);

$ pbpaste | js-pretty
javascript: (function(d, f, s) {
  s = d.createElement("script");
  s.src = "//crypto-js.googlecode.com/svn/tags/3.1.2/build/rollups/aes.js";
  s.onload = function() {
    f();
  };
  d.body.appendChild(s);
  f = function() {
    alert(typeof CryptoJS);
    alert(CryptoJS.AES.encrypt("hello", "1234"));
  };
})(document);

余分なオプションを気にしなくていいので、
前回のコマンド版より使い勝手がいいかも。


  • STDIN.gets(nil)の部分を、ARGF.gets(nil)に修正した方が、使い勝手が良くなる。
    • getsはデフォルトでARGFから読み込むことになっているので、
    • "STDIN."の部分を削除して、gets(nil)に修正するだけでOK。
  • ファイルパスで指定できるようになるのだ！
$ js-white FILE_PATH
  • もちろん、今までどおり標準入力からも受け取れる。
$ pbpaste | js-white


サービスにしておく

Automatorサービスも作ってみた。

ruby -r net/http -r uri -e "puts Net::HTTP.post_form(URI('http://closure-compiler.appspot.com/compile'),js_code:URI.decode(STDIN.gets(nil)),compilation_level:'WHITESPACE_ONLY',output_format:'text',output_info:'compiled_code',formatting:'pretty_print').body"
      • この日記の1行コマンドのコードがそのまま使える。



 on run {input, parameters}   display notification "pretty_print" with title "クリップボードにコピーしました。" subtitle "Closure Compiler" sound name "Blow"

 end run


JavaScriptコードを選択して、二本指タップしてみると...

これで素早く圧縮・整形できるようになった！