2016年3月9日水曜日

UbuntuのLESSCで自動コンパイル [ WEB ]

前回、lesscをUbuntuに導入したけれど、やっぱり、いちいちコンパイルするのが面倒なので、自動コンパイルする方法を探すことに。。。

すると、Dead Simple LESS CSS Watch Compilerなる素敵なソフトを発見!!
これを使えば、フォルダ内のファイルを更新すると自動的にコンパイルしてくれるぞ。
# npm install -g less-watch-compiler
使い方は
# less-watch-compiler [less監視フォルダ] [css出力フォルダ]
で、OK!
これで、快適になりましたとさ。めでたしめでたし。

と、思ったら・・・
なんと、cssが圧縮(minify)形式だった・・・
今回はCSS修正前提の納品物なので、圧縮形式はまずいね。
なので、ソースを修正する。
調べた結果「/usr/local/lib/node_modules/less-watch-compiler/lib/lessWatchCompilerUtils.js」を修正すればいいみたい!
--- /usr/local/lib/node_modules/less-watch-compiler/lib/lessWatchCompilerUtils.js.org 2016-02-17 22:22:47.930907153 +0900
+++ /usr/local/lib/node_modules/less-watch-compiler/lib/lessWatchCompilerUtils.js 2016-02-17 22:23:05.275173726 +0900
@@ -116,7 +116,7 @@
             compileCSS: function(file){
                 var dirname = path.dirname(file).replace(lessWatchCompilerUtilsModule.config.watchFolder, "") + "/";
                 var filename = dirname +path.basename(file, path.extname(file));
-                var command = 'lessc'+' -x '+file.replace(/\s+/g,'\\ ')+' > '+lessWatchCompilerUtilsModule.config.outputFolder+filename.replace(/\s+/g,'\\ ')+'.css';
+                var command = 'lessc '+file.replace(/\s+/g,'\\ ')+' > '+lessWatchCompilerUtilsModule.config.outputFolder+filename.replace(/\s+/g,'\\ ')+'.css';
                 // Run the command
                 // console.log(command)
                 exec(command, function (error, stdout, stderr){
要は、119行目のlesscを呼び出しているところで、-xオプションを外せば良いだけだ☆
これで、完璧・・・かな?

ふんどしの持ち主

0 件のコメント:

コメントを投稿