campassを使ってCSSをいじる

電脳備忘録

前回windowsにruby環境を構築してcompassをインストールしました。 何を間違えたのか、ファイルの変更が有効にならず時間をとられましたが、何とか解決できたので使い方について記録しておこうと思います。CentOS(開発用サーバ)にもインストールして使ってみましたが、下記の方法を読みかえて対応したところ、ファイル更新にあわせてcssの内容が更新されていました。

お約束

参照は自己責任でお願いいたします。

やったこと

例:Cドライブ直下にwebdevelopディレクトリがありそこに環境を構築しています。

webdevelopディレクトリへ移動後、560daysを作成。

C:\>cd webdevelop
C:\webdevelop>compass create 560days

webdevelopディレクトリに560daysが作成されているので、その直下のsassディレクトリにstyle.scssファイルを作っておく。

C:\webdevelop>cd 560days
C:\webdevelop\560days>compass compile sass/style.scss
C:\webdevelop\560days>compass watch sass/style.scss

560daysディレクトリに移動。移動後、style.scssをコンパイルしてstyle.scssをwatchするとstyle.scssを保存するたびにstyle.cssの内容が書き換わります。特に設定していなければstyle.cssはstylesheetsディレクトリの直下にあるかと思います。

細かい設定については英語と格闘しながらリファレンスを読み解きたいと思います。

広告

ブログの維持費に充てるでございます・・・。