ruby twitter-bootstrap heroku html spree

Bootstrap with Spree works locally but not on Heroku

I'm creating an app using Ruby On Rails, Bootstrap, and Spree. I have everything working fine on my localhost but when I push to Heroku I get an error message "We're sorry, but something went wrong." I can access the store area on Heroku when I add "/store" to the address it loads up fine, but the home page loads with an error message. When I run heroku logs I see this:

Processing by PagesController#home as HTML
2013-04-19T16:03:19.156092+00:00 app[web.1]:   Rendered pages/home.html.erb within layouts/application (100.2ms)
2013-04-19T16:03:19.156092+00:00 app[web.1]: Compiled jquery.alerts/jquery.alerts.css  (145ms)  (pid 2)
2013-04-19T16:03:19.156092+00:00 app[web.1]: Compiled jquery.alerts/jquery.alerts.spree.css  (0ms)  (pid 2)
2013-04-19T16:03:19.156092+00:00 app[web.1]: Compiled responsive-tables.css  (0ms)  (pid 2)
2013-04-19T16:03:19.156092+00:00 app[web.1]: Compiled normalize.css  (0ms)  (pid 2)
2013-04-19T16:03:19.156092+00:00 app[web.1]: Compiled skeleton.css  (0ms)  (pid 2)
2013-04-19T16:03:19.156092+00:00 app[web.1]: Compiled jquery-ui.datepicker.css  (259ms)  (pid 2)
2013-04-19T16:03:19.156092+00:00 app[web.1]: Compiled jquery.powertip.css  (0ms)  (pid 2)
2013-04-19T16:03:19.156092+00:00 app[web.1]: Compiled select2.css  (2728ms)  (pid 2)
2013-04-19T16:03:19.156538+00:00 app[web.1]: Compiled admin/spree_admin.css  (1552ms)  (pid 2)
2013-04-19T16:03:19.156538+00:00 app[web.1]: Compiled admin/spree_core.css  (4771ms)  (pid 2)
2013-04-19T16:03:19.156538+00:00 app[web.1]: Compiled admin/spree_promo.css  (1ms)  (pid 2)
2013-04-19T16:03:19.156538+00:00 app[web.1]: Compiled admin/all.css  (4785ms)  (pid 2)
2013-04-19T16:03:19.156538+00:00 app[web.1]: Compiled pages.css  (0ms)  (pid 2)
2013-04-19T16:03:19.156538+00:00 app[web.1]: Compiled store/screen.css  (600ms)  (pid 2)
2013-04-19T16:03:19.156538+00:00 app[web.1]: Compiled store/spree_core.css  (609ms)  (pid 2)
2013-04-19T16:03:19.156538+00:00 app[web.1]: Compiled store/spree_promo.css  (11ms)  (pid 2)
2013-04-19T16:03:19.156538+00:00 app[web.1]: Compiled store/all.css  (631ms)  (pid 2)
2013-04-19T16:03:19.156538+00:00 app[web.1]: Completed 500 Internal Server Error in 5726ms
2013-04-19T16:03:19.149366+00:00 app[web.1]: 
2013-04-19T16:03:19.149366+00:00 app[web.1]: ActionView::Template::Error (File to import not found or unreadable: bootstrap.
2013-04-19T16:03:19.149366+00:00 app[web.1]: Load path: /app
2013-04-19T16:03:19.149366+00:00 app[web.1]:     2: <html>
2013-04-19T16:03:19.149366+00:00 app[web.1]:     7:   <%= csrf_meta_tags %>
2013-04-19T16:03:19.149842+00:00 app[web.1]:     8: </head>
2013-04-19T16:03:19.149366+00:00 app[web.1]:     4:   <title>Sample App</title>
2013-04-19T16:03:19.149842+00:00 app[web.1]:   app/assets/stylesheets/styles.css.scss:5
2013-04-19T16:03:19.149842+00:00 app[web.1]:   app/views/layouts/application.html.erb:5:in `_2bef37236eb3fbbf2665a458326374e1'
2013-04-19T16:03:19.149366+00:00 app[web.1]:     5:   <%= stylesheet_link_tag    "application", :media => "all" %>
2013-04-19T16:03:19.149366+00:00 app[web.1]:     6:   <%= javascript_include_tag "application" %>
2013-04-19T16:03:19.149366+00:00 app[web.1]:   (in /app/app/assets/stylesheets/styles.css.scss)):
2013-04-19T16:03:19.149366+00:00 app[web.1]:     3: <head>
2013-04-19T16:03:19.157636+00:00 heroku[router]: at=info method=GET path=/ host=guarded-headland-2911.herokuapp.com fwd="98.154.183.5" dyno=web.1 connect=6ms service=6092ms status=500 bytes=643
2013-04-19T16:03:27.655609+00:00 heroku[web.1]: Stopping remaining processes with SIGKILL
2013-04-19T16:03:27.655609+00:00 heroku[web.1]: Error R12 (Exit timeout) -> At least one process failed to exit within 10 seconds of SIGTERM
2013-04-19T16:03:29.492003+00:00 heroku[web.1]: Process exited with status 137
2013-04-19T16:08:01.494500+00:00 app[web.1]: Started GET "/" for 98.154.183.5 at 2013-04-19 16:08:01 +0000
2013-04-19T16:08:01.526972+00:00 app[web.1]: 
2013-04-19T16:08:01.526972+00:00 app[web.1]: ActionView::Template::Error (File to import not found or unreadable: bootstrap.
2013-04-19T16:08:01.526972+00:00 app[web.1]: Load path: /app
2013-04-19T16:08:01.526972+00:00 app[web.1]:   (in /app/app/assets/stylesheets/styles.css.scss)):
2013-04-19T16:08:01.526972+00:00 app[web.1]:     2: <html>
2013-04-19T16:08:01.526972+00:00 app[web.1]:     5:   <%= stylesheet_link_tag    "application", :media => "all" %>
2013-04-19T16:08:01.526972+00:00 app[web.1]:     7:   <%= csrf_meta_tags %>
2013-04-19T16:08:01.526972+00:00 app[web.1]:     6:   <%= javascript_include_tag "application" %>
2013-04-19T16:08:01.527299+00:00 app[web.1]: Completed 500 Internal Server Error in 20ms
2013-04-19T16:08:01.526972+00:00 app[web.1]:     3: <head>
2013-04-19T16:08:01.526972+00:00 app[web.1]:     4:   <title>Sample App</title>
2013-04-19T16:08:01.527299+00:00 app[web.1]: 
2013-04-19T16:08:01.527299+00:00 app[web.1]: 
2013-04-19T16:08:01.527299+00:00 app[web.1]:   app/assets/stylesheets/styles.css.scss:5
2013-04-19T16:08:01.527299+00:00 app[web.1]: Processing by PagesController#home as HTML
2013-04-19T16:08:01.527299+00:00 app[web.1]:     8: </head>
2013-04-19T16:08:01.527299+00:00 app[web.1]:   app/views/layouts/application.html.erb:5:in `_2be
f37236eb3fbbf2665a458326374e1'
2013-04-19T16:08:01.527299+00:00 app[web.1]:   Rendered pages/home.html.erb within layouts/application (0.2ms)
2013-04-19T16:08:01.536160+00:00 heroku[router]: at=info method=GET path=/ host=guarded-headland-2911.herokuapp.com fwd="98.154.183.5" dyno=web.1 connect=9ms service=82ms status=500 bytes=643

My stylesheets application.css file looks like this:

/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the top of the
 * compiled file, but it's generally better to create a new file per style scope.
 *
 *= require_self
 *= require_tree .
 */

gemfile looks like this:

source 'https://rubygems.org'

gem 'rails', '3.2.13'
gem 'jquery-rails'
gem 'spree', '1.3.2'
gem 'spree_gateway', :github => 'spree/spree_gateway', :branch => '1-3-stable'
gem 'spree_auth_devise', :github => 'spree/spree_auth_devise', :branch => '1-3-stable'

group :production do
    gem 'pg'
end

group :development, :test do
    gem 'sqlite3'
end

group :assets do
  gem 'sass-rails',   '~> 3.2.3'
  gem 'coffee-rails', '~> 3.2.1'
  gem 'uglifier', '>= 1.0.3'
  gem 'bootstrap-sass', '~> 2.3.1'

end

Solution

If my comments don't work. Then I suggest the following.

Change application.css to application.css.scss
Remove *= require_tree . from application.css.scss
Add the following line @import "bootstrap"; to the bottom of the page in the file application.css.scss

The only problem with this is that you will have removed the Spree CSS files so the Spree layout will not look right. Currently Spree doesn't offer official support for Bootstrap. If this doesn't work, hopefully someone with more knowledge of Spree can help you out.