Entertainer Engineering

人を楽しませられる技術者を目指すあおかびんのブログ

Ruby on rails4系でBootstrap系のthemeを使うときに詰まった

どうも、こんにちはaokabinです。

二日間位railsにCosmoのデザインテンプレートを導入するのに苦労したので、備忘録として残しておきます。

事前準備として、

rails new testapp --skip-bundle
cd testapp/

というようにrailsアプリケーションを作って、作業ディレクトリに移動しておきましょう。
加えて、Gemfileの下の方に

gem 'twitter-bootswatch-rails', '~> 3.2.0'
gem 'twitter-bootswatch-rails-helpers'

の2つを記述しておきましょう。

詰まった点
1.therubyracerとlibv8のバージョンのいざこざ
2.bootswatch:importで毎回転ける

1.
gemでtwitter-bootswatch-railsとかhelperとか書いていると、作ったばかりのrails appではbundle installで転けてしまいます。
なんかtherubyracerがねえよ!とか言われるので、Gemfileに

gem 'therubyracer', platforms: :ruby

コメントアウトを外して再bundle install

bundle install

すると今度はlibv8がねえよ!このバージョンな!と怒られました。

gem 'libv8', 'そのバージョン'

と書いてbundle installすると

libv8がねえよ!このバージョンな!

は?いや、指定しとるやんけ!

こちらのサイトによると

therubyracer 0.11.0 問題まとめ - 自称すーじー。

どうやらtherubyracerとlibv8には互換性が微妙なところがあるらしく、どちらかのバージョンをちゃんと指定しないといけないらしい。

しかも、railsのエラーで言われたバージョンじゃダメらしい、頼むぜぃ。

今回はlibv8のバージョンをそろえるようにしましょう。

gem 'therubyracer', platforms: :ruby
gem 'libv8', '~>; 3.11.8.13'

ということでbundle installするとエラー無く通りました!
本当はもっといい方法があると思うんですがね…
いい方法あったらおしえてください。。。

別のパターンでnokogiriがねえよとか色々と怒られた覚えがあるけど、何かあればコメントでも残して頂ければ幸いです。

とりあえずbundleのエラーは解消されたという風にしておきましょう。

2.
さて、bundle installが通ったのでbootstrapデザインテンプレートを導入していきたいと思います。
次のサイトの2番を参考にして書いていきましょう。


ひと味ちがうTwitter Bootstrapの18個の無料テンプレート&有料まとめサイト - 酒と泪とRubyとRailsと

rails g bootswatch:install readable
rails g bootswatch:import readable
rails g bootswatch:layout readable

すると、bootswatch:importで謎のSSLエラーが発生します。
僕もこのSSLエラーを解消しようと色々調べたのですが、もうimportいいやという結論に至りました。
これもまたいいやり方あったら教えてください。

というわけで手順(使用するテンプレートはCosmo)

rails g bootswatch:install cosmo
rails g bootswatch:layout cosmo

layoutを実行してconflictが出てくるかもしれませんが、そういう時はとりあえずyとEnterの交互連打でなんとかなりました。

これで testapp/app/views/layoutsの中に
application.html.erbとcosmo.html.erbが出来上がるかと思います。
cosmo.html.erbはindex.html.erbにリネームしておいてください。

コレをちょっと検証するために、scaffoldを使って適当なアプリケーションページを作りましょう

まず最初にconfig/initializers/assets.rbに次の1文を追記してください。

Rails.application.config.assets.precompile += %w( cosmo.* )

そして次にlayoutsのcontrollerを作りましょう。

rails g controller layouts

そして最後にconfig/routes.rbにルーティング情報を書き込みます。

resources :layouts

rake routesも忘れないようにしておきましょう。

rake routes

さて、rake routesが終わったら実際に動かしてみましょう。

rails s

http://localhost:3000/layoutsにアクセスして

f:id:aokabin:20140912231727p:plain


このような画面が出てきたら成功です!

いやー疲れた。importって一体何だったんだろう…?

therubyracerとimportの問題について知っている人が居ましたら教えて頂けると幸いです。