MacでClosure Compilerを簡単にするAntの導入
GoogleのClosure CompilerはJavaScriptの圧縮ツールですが
コメントや改行の除去以外にも、複数のJSファイルを結合することもできます。
開発時は機能ごとにファイルを分けて管理して
リリース時には1ファイルに結合、という感じに使ってます。
ただ、ターミナルからいちいちコマンドを打つのが面倒だったのですが
Antというビルドツールを導入すると、コマンド一発で圧縮と結合を行えます。
Macには、JavaとAntがすでにインストールされてるので
Ant用の設定ファイルをつくってしまえば即利用できます。
サンプルも用意したのでぜひ試してみてください。
Closure Compilerのインストール
Closure Compilerをまだ持っていなければ
下記URLからダウンロードして、解凍後に任意の場所へ移してください。
http://closure-compiler.googlecode.com/files/compiler-latest.zip
使用にはJava 1.6が必要です。
優先するバージョンを変更するには
アプリケーション>ユーティリティ>Java Preferences.appから行います。
Java SE 6を一番上にします。
リスト内になければ、ソフトウェアアップデートをかけて最新にしてください。
コマンドラインからバージョンを確認するには
アプリケーション>ユーティリティ>ターミナル.appを起動して次を入力します。
java -version
いちおうAntもチェック。
ant -version
エラーがでなければ、準備が整いました。
コンパイルサンプル
http://dl.dropbox.com/u/498311/closure-compiler-sample.zip
index-dev.htmlをブラウザで開くと、カーソルキーでキャラクターを動かせるサンプルがでます。
JSはこんな感じで、5ファイルに分けてます。
<script src="./src/ui/Keyboard.js"></script> <script src="./src/display/Element.js"></script> <script src="./src/display/Sprite.js"></script> <script src="./src/display/Player.js"></script> <script src="./src/init.js"></script>
いっぽうのindex.htmlは、5ファイルを結合した "./bin/app.js" を読み込ませようとしてますが
まだ作成していないためエラーになります。
ちなみに、この5ファイルをClosure Compilerで
結合・圧縮するならこんなコマンドになります。
これを設定用のXMLに記述して、Antにやってもらおうというわけです。
Antを使ったコンパイル(圧縮)の手順
フォルダ内の build.xml をテキストエディタで開きます。
AntはこのXMLファイルの設定に従ってビルドを行います。
圧縮対象のJSはすでに記述してあるので、Closure Compilerの場所を追記します。
<taskdef name="jscomp" classname="com.google.javascript.jscomp.ant.CompileTask" classpath="コンパイラまでのパス"/>
サンプルでは、/Developer/SDKs/compiler-latest/compiler.jar にあると仮定してます。
XMLの修正が完了したら、ターミナルでサンプルファイルまで移動します。
移動にはcdコマンドで "移動先のパス" を入力します。
サンプルファイルをダウンロードフォルダで解凍したのならば、こんな感じです。
cd Downloads/closure-compiler-sample
無事に移動できたら、ant と入力して実行します。
処理が進んで BUILD SUCCESSFUL と表示されたら成功です。
サンプルファイル内に bin/app.js が出力されているでしょうか?
これでindex.htmlのJSも正常に動くようになってると思います。