Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

Ruby Build a Simple Ruby on Rails Application Deploying Deploying Treebook to Heroku

Sean Perryman
Sean Perryman
13,810 Points
Posted by Sean Perryman
Sean Perryman
13,810 Points

Missing CSS on Heroku Deployment

I've followed along and was able to finally push my app to Heroku and test it out.

http://treebook-seanperryman.herokuapp.com

It seems that it is not loading up the bootstrap CSS. I've double checked with git status, and everything is added and happy. Also, everything looks fine on my GitHub remote for this (http://github.com/sean-perryman/treebook). Any thoughts on resolving this missing CSS issue?

5 Answers

Sean Perryman
Sean Perryman
13,810 Points
Sean Perryman
Sean Perryman
13,810 Points

I asked the question over on StackOverflow, and was given the answer. By default, the Rails app is configured to compile your assets (CSS, etc) on the fly. Heroku does not do this, hence the need to precompile your assets before pushing them to the production site. One thing that was overlooked (I think) was to change the config.serve_static_assets setting in the config/environments/production.rb file to true. After doing this, and repushing the files to Heroku, everything started working.

Ref: SO: Pushing RoR app to Heroku, files in /public are missing

Tim Knight
Tim Knight
28,888 Points
Tim Knight
Tim Knight
28,888 Points

Sean, make sure you're precompiling your Sass and CSS assets. Heroku won't compile those on-the-fly like it does in your development environment. From the terminal (within your project folder) you'd write:

rake assets:precompile

Sean Perryman
Sean Perryman
13,810 Points
Sean Perryman
Sean Perryman
13,810 Points

I hadn't done that, but I went ahead and did and after the push it still seems the same. I am sure I am just missing something simple.

Tim Knight
Tim Knight
28,888 Points
Tim Knight
Tim Knight
28,888 Points

What's your heroku development address if you don't mind?

Ignore that... noticed it in your first request.

Tim Knight
Tim Knight
28,888 Points
Tim Knight
Tim Knight
28,888 Points

Your assets are now on Github, just make sure you're pushing to Heroku also...

git push heroku master

Sean Perryman
Sean Perryman
13,810 Points
Sean Perryman
Sean Perryman
13,810 Points

I apologize for my ignorance, but wouldn't it be: http://treebook-seanperryman.herokuapp.com ? If not, if you can tell me how I can retrieve it I would be glad to

Tim Knight
Tim Knight
28,888 Points
Tim Knight
Tim Knight
28,888 Points

You're right. That's it... you just need to push to heroku now that you've pushed to github.

Sean Perryman
Sean Perryman
13,810 Points
Sean Perryman
Sean Perryman
13,810 Points

Tried pushing to Heroku again, same situation. Do I need to remove the app from Heroku and re-push it?

Tim Knight
Tim Knight
28,888 Points
Tim Knight
Tim Knight
28,888 Points

You can try that but it shouldn't be necessary. It's clear that the files are located in your public/assets folder now on Github. Is Heroku giving you an error when you push?

Sean Perryman
Sean Perryman
13,810 Points
Sean Perryman
Sean Perryman
13,810 Points

I made a quick change and re-pushed the code to both GitHub and Heroku. Here is the output from the Heroku push:

-----> Ruby app detected
-----> Compiling Ruby/Rails
-----> Using Ruby version: ruby-2.0.0
-----> Installing dependencies using 1.5.2
       Running: bundle install --without development:test --path vendor/bundle --binstubs vendor/bundle/bin -j4 --deployment
       Using json (1.8.1)
       Using rake (10.3.1)
       Using i18n (0.6.9)
       Using minitest (5.3.3)
       Using thread_safe (0.3.3)
       Using builder (3.2.2)
       Using erubis (2.7.0)
       Using rack (1.5.2)
       Using mime-types (1.25.1)
       Using polyglot (0.3.4)
       Using coffee-script-source (1.7.0)
       Using bcrypt (3.1.7)
       Using arel (5.0.1.20140414130214)
       Using execjs (2.0.2)
       Using thor (0.19.1)
       Using orm_adapter (0.5.0)
       Using hike (1.2.3)
       Using pg (0.17.1)
       Using bundler (1.5.2)
       Using multi_json (1.10.0)
       Using sass (3.2.19)
       Using rdoc (4.1.1)
       Using tzinfo (1.1.0)
       Using tilt (1.4.1)
       Using rack-test (0.6.2)
       Using warden (1.2.3)
       Using treetop (1.4.15)
       Using uglifier (2.5.0)
       Using coffee-script (2.2.0)
       Using sdoc (0.4.0)
       Using activesupport (4.1.1)
       Using sprockets (2.11.0)
       Using mail (2.5.4)
       Using actionview (4.1.1)
       Using jbuilder (2.0.7)
       Using activemodel (4.1.1)
       Using actionpack (4.1.1)
       Using activerecord (4.1.1)
       Using actionmailer (4.1.1)
       Using railties (4.1.1)
       Using sprockets-rails (2.1.3)
       Using simple_form (3.0.2)
       Using coffee-rails (4.0.1)
       Using devise (3.2.4)
       Using jquery-rails (3.1.0)
       Using sass-rails (4.0.3)
       Using turbolinks (2.2.2)
       Using rails (4.1.1)
       Your bundle is complete!
       Gems in the groups development and test were not installed.
       It was installed into ./vendor/bundle
       Bundle completed (0.70s)
       Cleaning up the bundler cache.
       Detected manifest file, assuming assets were compiled locally
-----> WARNINGS:
       Include 'rails_12factor' gem to enable all platform features
       See https://devcenter.heroku.com/articles/rails-integration-gems for more information.

       You have not declared a Ruby version in your Gemfile.
       To set your Ruby version add this line to your Gemfile:
       ruby '2.0.0'
       # See https://devcenter.heroku.com/articles/ruby-versions for more information.

       No Procfile detected, using the default web server (webrick)
       https://devcenter.heroku.com/articles/ruby-default-web-server
-----> Discovering process types
       Procfile declares types -> (none)
       Default types for Ruby  -> console, rake, web, worker

-----> Compressing... done, 21.7MB
-----> Launching... done, v9
       http://treebook-seanperryman.herokuapp.com/ deployed to Heroku
Michael Wiss
Michael Wiss
19,233 Points
Michael Wiss
Michael Wiss
19,233 Points

Have you tried rake assets:precompile and then pushing to heroku again?

Sean Perryman
Sean Perryman
13,810 Points
Sean Perryman
Sean Perryman
13,810 Points

Using the Firefox console, it seems to be having issues with loading the CSS and JS files that are labeled

'application-73b133c60d8b44702a1aea753db41f19.css' and 'application-4dc704670cd76f40f1697bd36a2d3c02.js'

Now I see those in my GitHub repo in the public/assets directory, is there a way to push just those files up? Perhaps I will try adding a comment in both of those files, re-committing, and re-pushing and see if that will work.

Sean Perryman
Sean Perryman
13,810 Points
Sean Perryman
Sean Perryman
13,810 Points

No luck; still getting a 404 on those two files. Do I perhaps need to set some sort of directory permissions or something on the /public directory? I even tried deleting and recompiling the assets, with no luck.