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 The Rails Asset Pipeline and Styling Sass and Rails Foundation Style Overrides

Posted by Pete Cass
Pete Cass
16,656 Points

Where can we view the compiled sass in a rails app

Hey,

I feel like I've looked every where but I just can't find the compiled assets.

Where can i view the css file that will be served after compilation?

Pete Cass
Pete Cass
16,656 Points

Also, in regular websites I put an underscore under any sass partial why do we not have to do that here?

1 Answer

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

Pete if you're just working with your Rails app locally right now all of the is actually happening on the fly. You can generate your static assets though using rake assets:precompile (which is required when deploying to something like Heroku). You can then clear your compiled assets using rake assets:clobber. When you've compiled them they get dumped into /public/assets/.

And you can still use the underscore when you're using Rails. It's actually recommended. However by default Rails uses the asset pipeline which you can see at the top of the application.css file.

/*
 * 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 any plugin's vendor/assets/stylesheets directory 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 bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any styles
 * defined in the other CSS/SCSS files in this directory. It is generally better to create a new
 * file per style scope.
 *
 *= require_tree .
 *= require_self
 */

I however would recommend that you just kill that, rename your application.css file to application.css.scss and use the imports like you are use to so you can better control load order of your CSS declarations.