Rails is not compiling the css files in application.scss?

Question

I am new in ruby on rails and I am trying hard from last 3 hours to include my css files in the vendor/stylesheet/ directory in application.scss but it is not working.

css files path is

vendor/assets/stylesheets/

This is my code Application.scss

/*
 * 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 other CSS/SCSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *= require custom
 *= require pgwmodal.min
 */

This is the code of application.html

<%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload',debug: true  %>

My project mode is development.

I have to restart the server and cleared browser cache but still no luck.

Answer 1

Check you console to see if your assets are loading from anywhere. Sometimes you will need to make it .css.scss instead of just .scss . You can usually just leave it as .css . This all depends on your compiler and rails version. Have you tried forgoing manually putting them in for favor of require_tree . ?

Your custom .css would need to be in the stylesheets folder. If you are trying to load from the vendor's folder you would use a different approach.

Answer 2

The correct path for place css files is vendor/assets/stylesheets/

http://guides.rubyonrails.org/asset_pipeline.html#asset-organization

if you have

vendor/assets/stylesheets/custom.css
vendor/assets/stylesheets/pgwmodal.min.css

then you can include in your application.scss

*= require custom.css
*= require pgwmodal.min.css

or if you place your css in subdirectories

vendor/assets/stylesheets/dirname/custom.css

include using

*= require dirname/custom.css

you can check loaded paths in rails, type in terminal rails c then type Rails.application.config.assets.paths to see your assets paths