0

I'm using the bootstrap-sass gem with my rails (3.2.5) app, and things are working great in my local dev environment. But when I deploy to prod on Heroku the bootstrap CSS isn't included in the compiled assets.

I added bootstrap-sass and sass-rails to my Gemfile:

gem 'bootstrap-sass', '2.0.3.1'

group :assets do
  gem 'sass-rails',   '3.2.4'
end

And I added an import for Bootstrap to a custom.css file in my assets dir:

@import "bootstrap";

Basic stuff. Any idea why this isn't working in Prod?

BoltClock
  • 700,868
  • 160
  • 1,392
  • 1,356
Josh
  • 875
  • 1
  • 13
  • 25

2 Answers2

4

I was running into exact same problem. These are the steps I followed to resolve the issue:

  1. Add " *= require bootstrap" right above " *= require_tree ." in application.css.

  2. Then I did "bundle install --without production"

  3. Then I ran "rake assets:precompile"

  4. Then I did git add .

  5. Then I committed the changes git commit -m "blah..."

  6. Then push changes to production "git push heroku master"

Asma Zubair
  • 418
  • 1
  • 4
  • 11
  • +1 A slightly unsatisfactory solution (due to adding precompiled outputs to git), but worked for me with Rails 4.0.1 / Ruby 2.0.0 / boostrap-saas 3.0.1.0rc where nothing else did! I created a separate custom.css.scss and used @import "bootstrap" as the documentation recommended, however. – MZB Nov 08 '13 at 04:05
2

You must add a bootstrap_and_overrides.css.scss file in your app/assets/stylesheets with the next:

// Set the correct sprite paths
$iconSpritePath: asset-url('glyphicons-halflings.png', image);
$iconWhiteSpritePath: asset-url("glyphicons-halflings-white.png", image);

@import "bootstrap";
@import "bootstrap-responsive";

Also, you must add in your application.js:

//= require bootstrap

Regards!

hyperrjas
  • 10,666
  • 25
  • 99
  • 198
  • Thanks. I did that, but the bootstrap CSS still doesn't make it to production at all. – Josh Jun 19 '12 at 16:00
  • If you have this config, your problem is not bootstrap or your assets. Your problem is in your deploy or in your rails version. I have this config and it does works fine in my linode production server. Regards! – hyperrjas Jun 19 '12 at 16:56
  • I'm sure you're right. I don't know how to debug the deploy problem though. My solution was just to create a new empty project, copy over my app, and everything works fine. Moving on :) – Josh Jun 19 '12 at 18:06
  • 1
    There's a problem with the answer. You need to use `asset-path` instead of `asset-url`. The [bootstrap-sas](https://github.com/thomas-mcdonald/bootstrap-sass/blob/master/vendor/assets/stylesheets/bootstrap/_sprites.scss#L25) gem is already wrapping the returning asset path inside `background-image: url(...);`. Using `asset-url` returns the asset path enclosed in `url` and therefore doubles the `url(url(...))`. The correct syntax is to use `$iconSpritePath: asset-path('glyphicons-halflings.png', image);` – Zain Zafar Mar 15 '13 at 02:19