Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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

like image 334
Phil C Avatar asked Apr 22 '16 07:04

Phil C


2 Answers

 /*
 *= require_tree .
 *= require_self
 */

Add the above to your application.scss or application.css.scss file

like image 105
Soumitra Sarkar Avatar answered Oct 12 '22 11:10

Soumitra Sarkar


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.

like image 27
Phil C Avatar answered Oct 12 '22 13:10

Phil C