14
12

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

google製のjs,css圧縮処理(Closure Compiler)を手軽に実行する方法

Posted at

今回は、Closure Compiler は導入済みという前提で書きたいと思います。

内容としては、js,cssを圧縮したい!
けどコマンドを毎回入力するのは面倒臭い。
bashのaliasに登録するとか、シェルスクリプトで実装するとか
色々方法があると思いますが、今回は
makeコマンド一つで、コンパイル処理を行えるようにして行きたいと思います。

Closure Compiler とは
https://developers.google.com/closure/compiler/?hl=ja

それでは、実装編

通常コマンド実行するとしたら

java -jar /usr/bin/compiler.jar --js=aaaa.js --js_output_file=aaaa.min.js

これをソース修正の度に入力するのは、ちょっと。。。

java -jar /usr/bin/compiler.jar --js=aaaa.js --js=bbbb.js --js=cccc.js --js_output_file=mix.min.js

しかも、ファイルが増えると更に、、、
なので、makeコマンド一つで実行出来るようにしてみよう!

makefile

# minify対象のファイル
SRC=aaaa.js bbbb.js cccc.js

# minify後のxxxx.min.jsのxxxxの部分
MAKE_NAME=mix

# minify後の名前
MINFY_FILE=$(MAKE_NAME).min.js

# 一時ファイル作成(aaaa.js,bbbb.js,cccc.jsを結合したファイル)
COMBINE=/tmp/js.$(MAKE_NAME).js
COMPRESS=$(MINFY_FILE)

all : $(COMPRESS)

# aaaa.js,bbbb.js,cccc.jsを一つのファイルにまとめてます
$(COMBINE) : $(SRC)
        cat $^ > $@

$(COMPRESS) : $(COMBINE)
       # まとめた一時ファイルを指定した名前でminify化します。
        java -jar /usr/bin/compiler.jar --js=$< --js_output_file=$@
       #一時ファイル削除
        rm -f $(COMBINE)

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

これで

```bash
make
```
一つでファイルが作成される様になりました!

ついでに

```bash
make clean
```

で、一時ファイル、minify後のファイルを無かったことにできます。

makefileは色々できるので、他にも便利な方法があるかもしれません。
14
12
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
14
12

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?