google closure stylesheet を試してみた。

closure-stylesheetをgit clone

% mkdir ~/project
% cd project

% git clone https://code.google.com/p/closure-stylesheets/
% cd closure-stylesheets
% ant
% ant test

ヘルプを見ておく

% java -jar build/closure-stylesheets.jar --help

実行権限付与

% chmod +x build/closure-stylesheets.jar

サンプルプロジェクトを作成

私の場合はこんな感じ

% mkdir -p ~/project/Scribbled
% cd ~/project/Scribbled
% mkdir -p script
% mkdir -p root/css

シンボリックリンクを作成する。

% ln -s ~/project/closure-stylesheets/build/closure-stylesheets.jar script/closure-stylesheets.jar

cssの圧縮

適当なcssを作成してcompileしてみるその1

ファイル作成

% vi root/css/sample.css

h1 { margin-left: 10px }
h1 { margin-right: 10px }

実行

% java -jar script/closure-stylesheets.jar root/css/sample.css
h1{margin-left:10px;margin-right:10px}

適当なcssを作成してcompileしてみるその2

ファイル作成

% vi root/css/sample2.css

h1 { margin-left: 10px }
h1 { margin-right: 10px }
h1 { margin: 10px }

% java -jar script/closure-stylesheets.jar root/css/sample2.css
h1{margin:10px}

複数のcssファイルを結合する事も可能

% java -jar script/closure-stylesheets.jar root/css/sample.css root/css/sample2.css
h1{margin:10px}

見やすくしたい場合

% java -jar script/closure-stylesheets.jar --pretty-print root/css/sample.css
h1 {
  margin-left: 10px;
  margin-right: 10px;
}

まとめ

他にもいろいろな機能があるようですが、自分でアプリ開発している人は簡単にCSSを圧縮できてよいんじゃないかなあと思いました。