bootstrap-generators で bootstrap 導入後、一部の flash が使えなくなる現象
イントロ
bootstrap 導入すると、flash がちゃんと動かなくなって戸惑うやつ。
decioferreira/bootstrap-generators で生成する flash 部分にミスがあるのが原因(多分)
具体的には flash[:alert]
時でも、緑枠の flash メッセージになってしまう現象。
ちゃんと考えると直せるんだけど、思い出すのが面倒なので残す。
環境
rails 4.2.1
sass-rails 5.0.3
bootstrap-sass 3.3.4
bootstrap-generators 3.3.1
各 gem の install 方法なども省略。 README.md
の通りです。
bootstrap-generators について
意外とスター数が少ないので補足。
rails で twitter-bootstrap 導入しようとすると、有名なのは以下の2つ。
- seyhunak/twitter-bootstrap-rails
LESS
- generator 付き
- install 面倒 (随分前の記憶だけど)
- 有志が作ってる?
- twbs/bootstrap-sass
sass(scss)
- generator 付いてない
- install 簡単
- 公式(
Official Sass port of Bootstrap
)
bootstrap-sass
のほうが簡単に導入できるが、generator が付いていないので、view 等が手作りになってしまう。
一方で twitter-bootstrap-rails
は導入が面倒だが、generator が便利で、一回インストールできてしまえば楽になってくる、という感じ。
正に一長一短な2つの gem なわけですが、実は boostrap の generator は gem になって切りだされていて、bootstrap-sass
と合わせることで「install 簡単」と「generator」のイイトコロ取りをできるわけです。
その generator が decioferreira/bootstrap-generators です。
rails generate bootstrap:install
これで bootstrap のあの黒いヘッダー(やそれ以外も)が生成されます。
haml/slim/erb
に対応している。
直し方
app/views/layouts/application.html.erb
(bootstrap 導入後)
の class を作っている部分を直す。
<% flash.each do |name, msg| %> - <%= content_tag :div, :class => "alert alert-#{ name == :error ? "danger" : "success" } alert-dismissable", :role => "alert" do + <%= content_tag :div, :class => "alert alert-#{ name == "alert" ? "danger" : "success" } alert-dismissable", :role => "alert" do <button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button> <%= msg %> <% end %> <% end %>
後はいつもどおり flash[:alert]
してあげればよい。
if @user_session.save redirect_to root_url, notice: "Login successful" else redirect_to login_url, alert: 'Login failed.' end
何も考えず redirect_to login_url, error: 'Login failed.'
みたいにやっても効かないので注意。
(view で :error
とあるから引っかかった。)
参考
おまけ
記述量を最小限にして直すと、上記のようになるけど、いやちゃんと考えたい、という場合には以下が参考になる。
以下の 3 つのうち、どれかを使えばひとまずは大丈夫そう。
(要は flash のキーが bootstrap のクラスに対応していればいいだけなので)