Philip C Philip C - 4 years ago 100
CSS Question

My rails stylesheets are not loading/working

It's been a while since I've developed in Rails and I'm having trouble getting any

scss
stylesheet to work on my freshly created rails app.

layouts/application.html.erb
has the default
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
at the top.

For testing purposes, I created a
main.scss
file in
assets/stylesheets/
that looks like this:

* {
border: 1px solid black;
}


I thought the
application.scss
file is supposed to grab all the stylesheets in it's folder and child folders but it's not. (Oddly, the
.js
files load just fine.)

I've tried
RAILS_ENV=production rake assets:precompile
but it didn't do anything. Could someone explain what it even does?

I've tried adding
*= require main
and
*= require main.scss
to
application.scss
. I even changed the file ext to css for both files. The only way I've gotten any css to render is by directly adding the code to
application.scss
, which I don't want to do.

Please help me with this.

EDIT 1



I'm going to add some more info since I'm getting generic answers. I mentioned that it's a fresh rails app so the basic things are already pre-generated. This is how my
application.scss
looks:

/*
* 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 main
*= require_self
*/


Still, nothing works

Answer Source

Looks like the only way I can get it to work is by adding @import main; to application.scss. It seems like the styles end up being used on every page (is this the default in rails?).

This is not my ideal solution but it's the only thing I've been able to do to get any styles to work via requiring methods.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download