Closure Compilerを使う!
Closure Compiler Application
最終更新:
aias-closurecompiler
トップページ >
Closure Compiler Application
Closure Compiler ApplicationはJavaで実装されたコマンドラインアプリケーションとしてClosure Compilerの機能を提供します。他の提供形式と比べ、Closure Compiler Applicationは以下の点で優れています:
- 外部サーバとの通信を一切行わず、単独で動作します。このため導入に際して外部との通信経路を考慮しなくてよく、また入力ファイルをWEBに公開する必要もありません。
- 入力データサイズの制限はありません。
- 細かいオプションが提供されており、Closure Compilerのもつ機能を最大限に利用することができます。
ある程度以上の規模のシステムでは、Closure Compiler Applicationの導入をお薦めします。
目次:
インストール
- Closure Compiler Applicationの実行にはJavaの実行環境( JRE6 以上)が必要です。まだインストールされていない場合は、事前にその作業を行ってください。
- 下記のURLから compiler.jar をダウンロードし、任意のディレクトリに保存、展開します。これでインストールは完了です。
- ここから、Closure Compiler Applicationの過去のバージョンをダウンロードできます。
使い方
Closure Compiler Applicationは普通のJavaアプリケーションですので、実行方法自体は至ってシンプルです。以下ではごく短いサンプルコードを使ってコンパイルの手順を説明します。
-
以下のJavaScriptコードを内容とする
hello.js
というファイルを作成し、
compiler.jar
と同じディレクトリ(ここでは
closure-compiler
ディレクトリとします)に保存します。
// A simple function.
function hello(longName) {
alert('Hello, ' + longName);
}
hello('New User'); -
closure-compiler
ディレクトリで以下のコマンドを実行します。
java -jar compiler.jar --js hello.js --js_output_file hello-compiled.js
このコマンドは hello-compiled.js という名前の新しいファイルを生成します。このファイルの中身は圧縮されたJavaScriptコードです。
function hello(a){alert("Hello, "+a)}hello("New User");
コマンドのオプションでコンパイルレベルを明示的に指定していないため、この例ではデフォルトのコンパイルレベルである SIMPLE_OPTIMIZATIONS が適用されています。 SIMPLE_OPTIMIZATIONS レベルでは、全てのコメント・改行・不要な空白が削除されるほか、ローカル変数が短くリネームされます。上の結果を見ると、実際に元のコードでは longName という名前だった変数が a に変わっているのがわかります。
-
下のように
hello-compiled.js
をHTMLに読み込んでみれば、コンパイルされたJavaScriptコードが正常に動作していることが確認できます。このHTMLファイルをブラウザにロードすると挨拶メッセージが表示されるはずです:
<html>
<head><title>Hello World</title></head>
<body>
<script src="hello-compiled.js"></script>
</body>
</html>
Antタスクを利用する
compiler.jar には組み込みのAntタスクが含まれています。残念ながら使える機能はそれほど多くありませんが、とても簡単に利用できます。
サンプルビルドファイル
<?xml version="1.0"?>
<project basedir="." default="compile">
<taskdef name="jscomp" classname="com.google.javascript.jscomp.ant.CompileTask"
classpath="../build/compiler.jar"/>
<target name="compile">
<jscomp compilationLevel="simple" warning="verbose" debug="false" output="output/file.js">
<externs dir="${basedir}/src">
<file name="extern.js"/>
</externs>
<sources dir="${basedir}/src">
<file name="simple1.js"/>
<file name="simple2.js"/>
</sources>
<sources dir="${basedir}/other">
<file name="simple3.js"/>
</sources>
</jscomp>
</target>
</project>
リファレンス
属性
名前 | 説明 |
compilationlevel | --compilation_levelオプションに相当し、コンパイルレベルを whitespace 、 simple 、 advanced のいずれかで指定します。デフォルトは simple です。 |
customexternsonly | --use_only_custom_externsオプションに相当し、 true を指定するとデフォルトのexternファイルを使用しません。デフォルトは false です。 |
debug | --debugオプションに相当し、 true を指定するとデバッグ用の出力を行ないます。デフォルトは false です。 |
output | --js_output_fileオプションに相当し、コンパイル結果の出力ファイル名を指定します。 |
warning | --warning_levelオプションに相当し、エラーと警告の出力量を quiet 、 default 、 verbose のいずれかで指定します。デフォルトは default です。 |
ネストできる要素
このタスクには次の2つの要素をネストさせることができます。これらはFileList型の要素で、Compilerに渡されるファイルのリストを表します。
名前 | 説明 |
externs | コンパイルに使用するexternファイルを指定します。 |
sources | コンパイル対象となるJavaScriptファイルを指定します。 |
externs と sources は共に複数指定可能です。