Coda 2 で Compass を使う

Coda 2 で Sass を使う の続き。Compass を使うと自動変換できたり便利だそうで。以下参考にさせていただいたページ。

RubyGem を最新版にする

$ sudo gem update --system

Compass をインストール

$ sudo gem install compass

Coda 2 のターミナルで日本語が文字化け??????????????????

早速 Coda 2 に内蔵されているターミナルで Compass を使おうと思ったらうまくいかない。ええっ!と思って普通のターミナルでやったらできる。違いは日本語が表示されているかいないかくらいしか思いつかないのでぐぐったら自分のブログが(ry
Coda のターミナルでは日本語が使えない – p15.jp

ターミナルで日本語が文字化けしてしまう問題(今となっては自分の設定不足)が気になっていました。
ネットで調べてみても「Codaのターミナルは日本語が使えない!」というような記述があったため、てっきり使えないものだと決めつけていた

Coda2のターミナルの文字化けを解決する方法(恥)
:ビジネスをデザインするブログ:ITmedia オルタナティブ・ブログ

すいません使えないと決めつけていたネットの情報のうちの一人です。いやもしかしたら Coda では日本語バケラッタで Coda 2 だから解決策があるのかもしれないよね!上記の記事にて紹介されている解決策は、.bash_profile に以下を追記。

export LANG=ja_JP.UTF-8

直ったー!!日本語見えるー!!

Compass を使う

Coda 2 に内蔵されているターミナルを開くと、サイトに登録されているローカルルートを開いた状態で起動してくれるから便利ですね。早速 Compass を使ってみます。

$ compass create _sass --sass-dir "sass" --css-dir "../common/css" --javascripts-dir "../common/js" --images-dir "../common/img" -s "expanded" --relative-assets --no-line-comments --bare

引数を指定して、こんなかんじでどうでしょうか。–bare はターミナルで -h したら出てくる中に書いてあった。

public_html
 _sass
   sass
     xxxxx.scss
   config.rb
 common
   css
     xxxxx.css
   img
   js

ディレクトリ構成はこうなる。ほんとは _sass フォルダを public_html の外側に置きたいんだけど、どうもうまくいかんかった。

Compass で監視 <●> <●>

$ cd _sass
$ compass watch

config.rb のある場所(今回は _sass)へ移動してから watch。–bare で _sass フォルダの中身が空っぽの状態で watch したらエラー出た。.scss があれば動いた。監視中は .scss ファイルを保存する度に自動変換して .css を生成してくれます。Coda 2 の端っこのタブでターミナルを開きっぱなしにしておけば邪魔にもならん。

Coda-Sass-Plug-in や coda-sass-plugin は不要

プラグインがやってくれていたことを Compass がやってくれるのでプラグインが不要に。しかも Compass の方が詳しく設定できる。やったね!

Coda 2 で Sass を使いたい人は、Compass も一緒にインストールしよう!!

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です