Sassの翻訳ツール Prepros を導入してみました。コマンドライン叩きながら作業するのってやっぱりちょっと億劫な気がしていたので、、、Prepros 便利です。
Sassってなに？
CSSメタ言語の総称をSassというそうです。CSSメタ言語には「Less」「Sass」「Stylus」「SCSS(Sassy CSS)」といろいろあるので、自分に気に入ったものを使っていくことになると思うのですが、中には複数のCSSメタ言語を利用することになったりします。大抵このCSSメタ言語ってRubyで書かれているようなので、それぞれ設定してあげないといけません。
PreprosならGUI
GUIで複数のメタ言語を扱える、（私の場合は、Less と SCSS を予定）ので、こちらのほうが便利かなとさっそく導入してみました。
公式サイトは、http://alphapixels.com/prepros/ から、windowsようマック用、どちらも利用できるのでうれしいです。さっそく該当する方をダウンロードします。
マック版の方は解凍したらそのままダブルクリックで起動しました。windows版はインストーラでインストールでした。
さっそく立ち上げてみます。こんな感じですね。この起動画面に、フォルダをドラッグ＆ドロップするとプロジェクト登録してくれます。
言語も何か、自動識別してくれるので便利です。
こんな感じで、プロジェクト登録してくれます。そのままだとドラッグしたフォルダと同じ階層に「css」というフォルダを作成しその中に各設定になっています。
やじるしのところをクリックして、保存先とファイル名も変更することができます。
一番下の【Compile】ボタンをクリックするとCSSが作成されます。以降はプロジェクト内の元のデータを書き換え保存する度に自動で反映してくれます。ボタンの上のメニューで圧縮とかもしてくれるので、もうこれでいい感じにしてくれます。
個人的にはまだSass始めたばかりなので、スゲー簡単って感動してるところなので、まずは動けばうれしい感じなので、実際にしばらく使っていくと、やっぱり黒い画面の方が、軽いし簡単だわーってなるのかもしれませんが、設定コマンドをそれぞれおべんきょしなきゃななタイミングでこれに出会えてよかったように思っています。
コメント