心機一転、Compassを利用してブログのデザインをリニューアルしたので、Compassのセットアップ方法と、herokuへのデプロイ時のメモを残しておきます。Compassのご紹介はまた次回に!
環境
Rails 3.1.3 ruby 1.9.2 p290
Compass
Compassは現時点で最新のものを入れておきます。
gem 'compass', "~> 0.12.alpha.3"
bundleしてから、次のコマンドでCompassの基本的なファイルを生成します。--syntax sass
を指定しない場合はscssで生成されますが、Rails3.1系を使うなら迷いなくsassを使う方が良いでしょう。生成されるファイルの構成の理由についてはCompass Best Practicesを読むとそういうものなんだなぁと分かります。
$ compass init rails --using blueprint --syntax sass directory app/stylesheets/ directory app/stylesheets/partials/ directory public/images/ directory public/stylesheets/ create config/compass.rb create app/stylesheets/screen.sass create app/stylesheets/partials/_base.sass create app/stylesheets/print.sass create app/stylesheets/ie.sass create public/images/grid.png Congratulations! Your rails project has been configured to use Compass. Just a couple more things left to do. Add the following to your Gemfile: gem "compass", ">= 0.12.alpha.3" Then, make sure you restart your server. Sass will automatically compile your stylesheets during the next page request and keep them up to date when they change. Now add these lines to the head of your layout(s): <%= stylesheet_link_tag 'screen.css', :media => 'screen, projection' %> <%= stylesheet_link_tag 'print.css', :media => 'print' %>
stylesheetsディレクトリはassets以下に移動しておきます。また、public/images以下に作られたgrid.pngもassets以下に移動しておきます。
$ cp -r app/stylesheets app/assets $ rm -rf app/stylesheets $ mv public/images/grid.png app/assets/images
application.html.erbのheadタグ内に次のコードを追加。
<%= stylesheet_link_tag 'screen.css', :media => 'screen, projection' %> <%= stylesheet_link_tag 'print.css', :media => 'print' %>
Hamlで書くなら以下のようにします。
%head = stylesheet_link_tag 'screen.css', :media => 'screen, projection' = stylesheet_link_tag 'print.css', :media => 'print' = stylesheet_link_tag 'ie.css', :media => 'screen, projection'
heroku
何はともあれheroku_sanをいれておきましょう。
gem 'heroku_san', :group => :development
bundleしてからConfigファイルを作成し、Heroku Appを作成します。
$ rake heroku:create_config
Rails 3.1からはCedarスタックでアプリケーションを作成する必要があります。Bambooでも運用できないことはないのですが、Compassとの組み合わせだとかなり難しいので、せめてCompassを使う場合はCedarで作った方が無難です。
production: app: mah-lab-cedar stack: cedar config: BUNDLE_WITHOUT: "development:test" TZ: "Asia/Tokyo" staging: app: mah-lab-cedar-staging stack: cedar config: &default BUNDLE_WITHOUT: "development:test" TZ: "Asia/Tokyo"
$ rake all heroku:create heroku:rack_env $ rake all heroku:config
既にBambooスタックで運用しているアプリケーションをCedarに移行する場合、Heroku側で移行する仕組みは用意されていないため、DBを手動で移行する必要があります。(heroku db:pullとpushを使う等)
アプリケーションを作成してherokuにデプロイする前に、以下の作業をします。
gem 'pg', :group => [:production]
gem 'sqlite3', :group => [:development, :test]
config.assets.compile = true
後はheroku_sanが上手いことデプロイしてくれます。
$ rake staging deploy
このブログは実際にRails3.1 + Compassの構成で作成しているので、このブログのソースコードを見て頂くのでも良いと思います。