この記事は賞味期限切れです。（更新から1年が経過しています）

圧縮に便利なYUI Compressorですが、これは複数ファイルの取り扱いには対応していません。
そういうのはGoogle Closure Compilerが得意そうですが、小規模な開発には少々大仰かも。
そんなわけで今回は、makeコマンドとYUI Compressorの連携で
JSファイルをコンパイルする例に関する備忘録。

やりたいこと

例えば、

• hoge.js
• fuga.js
• foo.js
• bar.js

という4つのJavaScriptファイルがあるとして、
これらを順に結合して「main.js」として出力し、
さらにそれをYUI Compressorで圧縮して「main.min.js」を出力したい。

Makefileの例

makefileの基本的な書き方は、入門的な記事がいろんな所にあるのでそちらをご参考に。
上記の処理をする為のmakefileはこんな感じになります。
「Makefile」という名前でJavaScriptファイルと同じディレクトリに保存しておきましょう。

※前記事のyuicコマンドを設定してある前提です

SRC = hoge.js fuga.js foo.js bar.js
COMBINE = main.js
COMPRESS = main.min.js

all : $(COMPRESS)

$(COMBINE) : $(SRC)
    cat $^ > $@

$(COMPRESS) : $(COMBINE)
    yuic $< > $@

.PHONY: clean
clean :
    rm -f $(COMBINE) $(COMPRESS)

Line 1-3

結合したいファイル群と、出力用のファイル名をマクロにつっこんでおきます

Line 7-8

catコマンドで結合したいファイル群の中身をまるっと$(COMBINE)の中につっこみます
$^ は依存ファイル全てを展開、$@はターゲットファイルを指します

Line 10-11

yuicコマンド（前記事参照）でYUI Compressorを通して圧縮した結果を$(COMPRESS)の中に突っ込みます

Line 13-15

“make clean” で出力したファイルを削除する為の記述です
$(COMBINE) と $(COMPRESS) で展開される、「main.js」と「main.min.js」を削除します

で、どうするの

make / make all

makeの使い方ですが、ターミナルでMakefileのあるディレクトリに移動し、
makeコマンドを実行するだけです。
あとはmakeの中の人が、main.jsとmain.min.jsを自動的に生成してくれます。

make

make clean

生成したファイルを消して初期化したい場合は次のようにタイプします。

make clean

注意事項

環境に注意

MacやLinuxならば、ターミナルでそのまま実行すればコンパイルしてくれますが、
Windowsではmakeはそのままでは使えず、Cygwin等に頼る必要があります。ご注意を。

結合するスクリプトに注意

単体で読み込まなければ正常に動作しないライブラリ等も存在します。
なので、結合前は動いたのにコンパイルしたら動かなくなった！なんていう事態も起こったり。
闇雲に全て結合・コンパイルしてしまうのは避けたほうが良いかも。