HOME>情報備忘録>[LESS][CSS][Windows]lessc.exeでエスケープ構文のエラーと対処法

[LESS][CSS][Windows]lessc.exeでエスケープ構文のエラーと対処法

Windowsで.less利用する場合に勝手におススメしてたlessc.exeがダメっぽいw どうもエスケープが通らない感じ。このサイトみてlessc.exe使い始めた人がいたらごめんなさい。

lessc.exeでエラーとなる構文

bootstrap使ってて気がついたんだけど、

フォルダ構成

  1. .element {
  2.     filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",@startColor,@endColor));
  3. }
  4.  
  5. .element {
  6.     filter: ~"alpha(opacity=@{opacity})";
  7. }
  8.  

あたりがダメっぽい。WindowsのGUI版のWinLessもエラーになる。

対処法

ってことでlessc.exeからduncansmart/less.js-windows · GitHubに乗り換えた。 これだと上に書いたエスケープも通る。今後Windows環境でLESSを利用する場合、こちらをおススメしていこうと思います。

利用方法はlessc.exeと同じだけど、オプションの指定がちょっと異なってます。 参考までに僕は下記のようなcmd書いてeclipseのビルダーで自動実行させてます。

compile.cmd

  1. :: +++++++++++++++++++++++++++++++++++++++
  2. ::
  3. :: 環境設定
  4. ::
  5. :: +++++++++++++++++++++++++++++++++++++++
  6.  
  7. :: ---------------------------------------
  8. :: LSSSコンパイラのディレクトリ
  9. :: ---------------------------------------
  10. Set DIR_LESSCOMPILER=C:\LESS\
  11.  
  12. :: ---------------------------------------
  13. :: プロジェクトディレクトリ
  14. :: ---------------------------------------
  15. Set DIR_PROJECT=C:\my_project\
  16.  
  17. :: ---------------------------------------
  18. :: サイトドキュメントルート
  19. :: ---------------------------------------
  20. Set DIR_DOCUMETROOT=%DIR_PROJECT%public_html\
  21.  
  22. :: ---------------------------------------
  23. :: LESSディレクトリ
  24. :: ---------------------------------------
  25. Set DIR_LESS=%DIR_PROJECT%less\
  26.  
  27. :: ---------------------------------------
  28. :: css書き出しディレクトリ
  29. :: ---------------------------------------
  30. Set DIR_CSS=%DIR_DOCUMETROOT%css\
  31.  
  32. :: +++++++++++++++++++++++++++++++++++++++
  33. ::
  34. :: コンパイル設定
  35. ::
  36. :: +++++++++++++++++++++++++++++++++++++++
  37.  
  38. :: ---------------------------------------
  39. :: プロジェクトで利用するCSS全部
  40. :: 確認用に圧縮版と非圧縮版を出力
  41. :: ---------------------------------------
  42. call %DIR_LESSCOMPILER%lessc %DIR_LESS%bootstrap.all.less %DIR_CSS%all.less.css
  43. call %DIR_LESSCOMPILER%lessc %DIR_LESS%bootstrap.all.less %DIR_CSS%all.less.min.css -compress
  44.  
  45. :: ---------------------------------------
  46. :: フォントの装飾系
  47. :: 確認用に圧縮版と非圧縮版を出力
  48. :: ---------------------------------------
  49. call %DIR_LESSCOMPILER%lessc %DIR_LESS%bootstrap.font-styles.less %DIR_CSS%font-styles.less.css
  50. call %DIR_LESSCOMPILER%lessc %DIR_LESS%bootstrap.font-styles.less %DIR_CSS%font-styles.min.css -compress
  51.  

ってかe()なんてどこに書いてあるんだろ・・・?

投稿日 2012年6月19日 11:09
カテゴリ 開発環境
タグ CSS | LESS | Windows
トラックバック URL http://www.kantenna.com/cgi-bin/mt504/mt-tb.cgi/1304

コメント

コメントする
Name
Email Address
URL