[LESS] LESSことはじめ

あらまし

遅れ馳せながら、LESSを使ってみたぁい！！
ということで、基本的なところを押さえようとしておるところでございまして。

前提

• less.jsを使う。
• style.lessはstyle.cssから拡張子を変えてごにょごにょする。

書き方

hoge.html

<link rel="stylesheet/less" type="text/css" href="styles.less" />
<script src="less.js" type="text/javascript"></script>

と、まぁ、この辺のことはね、検索したらぽんぽこ出てくるんですわ。
ただひとつ、引っ掛かったことがあって。

hoge.css

@CHARSET "UTF-8";

これ。
CSSファイルの文字コードを指定するやつ。

普通にCSSとして使ってたときにはむしろ必要なものやったはずやのに、こいつのせいでエラーを吐きよる…あかん…あかんでぇ… (:3_ヽ)_ .

んで、こう言われますねんわ。

ParseError: Unrecognised input

と。
「変換しよおもたけど、なんや認識でけへんもんあんねんけど？」って。

多少LESSをかじったあとの人ならわかりはりまっしゃろ？
これ、「変数と誤解されておかしなことになってる」ってスンポーちゃいまっか？と。

というわけで…

全部消したれ ( ･`ω･´)ｗｗｗ

結局のところ、Parseのときに邪魔になるわ、Parse後の出力時はHTML自体のCharsetに準拠するわってことで…いらへんのですわ。

チャンチャン♪

あ、注意としては…
消すのは「対象とするすべてのファイル」なんで、見落とさへんように。
そう、コンパイルの対象とするなら、CSSファイルからも除去する必要があるってことですわ。

hoge.html

<!-- 対象 -->
<link rel="stylesheet/less" type="text/css" href="styles.css" />
<!-- 非対象 -->
<link rel="stylesheet" type="text/css" href="styles.css" />

…むつかしわぁ (´･ω･｀)