LESSの実装に便利なエディタ「Crunch」を紹介します。

less

LESSファイルの編集に便利なCrunchのインストール方法と簡単な使い方を紹介します。

[スポンサーリンク]

このページでやること

Crunchのインストール方法とCSSへコンパイルする方法を紹介します。

Crunchをインストールする

以下のサイトからCrunchをダウンロードしてインストールします。
インストールは基本落としてきたファイルをダブルクリックすればOKです。
インストールにはAdobe AIRが必要になりますが、ダブルクリックしてインストールが正常に始まればあとは何もしなくてもよいです。
less-editor-crunch

Crunchを使ってLESSファイルを作る

まずは新規でLESSファイルを作成します。
赤丸をクリックして新しいファイルを作成します。
less-editor-crunch2

LESSを記述して、赤丸部分をクリックするとCSSファイルができあがります。
less-editor-crunch3

デフォルトの状態だとできあがったCSSに改行が入っていません。
less-editor-crunch4

歯車をクリックして、「Minifly CSS」をクリックして再度「Crunch File」をクリックすると改行やスペースが入って人の目でソースが追えるようになります。
less-editor-crunch5

さいごに

Crunchを使うとLESSの開発がすごくやりやすくなるのでオススメです。
というよりは必要不可欠な開発ツールだと思うので、LESSを使う人は必須でインストールしてみてください!
それでは!