css not loading on rails

Question

Hi guys new to rails and I'm playing around with it but I cannot get the CSS to load. I'm on windows

This is my application.css file

*= require_tree .
*= require_self


body {
  background-color: blue;
}

application.html.erb file

<!DOCTYPE html>
<html>
  <head>
    <title>Blog</title>
    <%= stylesheet_link_tag    'default', media: 'all', 'data-turbolinks-track' =>      true %>
    <%= javascript_include_tag 'default', 'data-turbolinks-track' => true %>
    <%= csrf_meta_tags %>
  </head>
  <body>
    <%= yield %>
  </body>
</html>

could You check inspector panel in chrome and click on network tab to find requests that makes error? I think Your css file is not accessible public-ly to be retrieved by browser — num8er, Dec 21 '16 at 01:28
Do you get any erros in browser console or in your rails server? — Brad, Dec 21 '16 at 01:29
@brad I was getting an error on application.html.erb file so I had to change 'application' to 'default' and that fixed the error but unfortunately the css is not loading — TestUserNewDefault, Dec 21 '16 at 01:33
@num8er I think you may be right I'm getting a 404 status on the css, I think it's because I have it linking to 'default' instead of 'application' but I had to do this to get rails working on windows — TestUserNewDefault, Dec 21 '16 at 01:35
@Carl I know it's stupid, but just copy that css to public folder and try to access it. — num8er, Dec 21 '16 at 01:35
@Carl revert it from `default` to `application` and use this code: `<%= stylesheet_link_tag "application", media: "all" %>` (without `'data-turbolinks-track' => true`) so, if it will work, it means that You've error in Your css file that turbolinks cannot process or configuration of assets pipeline is wrong. — num8er, Dec 21 '16 at 01:43
@num8er Getting this error when I revert 'default' to 'application' "Showing C:/Users/carl/Desktop/leanRails/blog/app/views/layouts/application.html.erb where line #5 raised:" — TestUserNewDefault, Dec 21 '16 at 01:51
so it means that it's trying to use turbolinks to watch Your css file, but because of first lines in Your css it's crashing to read first lines. please read my answer and try to check. and if it does not work, please put somewhere whole body of error. — num8er, Dec 21 '16 at 01:52

Duyet Nguyen · Answer 1 · 2016-12-21T01:33:15.890

0

Your application.html.erb miss tag body. There is only close </body> without open

You are wrong at stylesheet_link_tag 'default' and javascript_include_tag 'default'. Change default to application

Sample:

<!DOCTYPE html>
<html>
<head>
  <title>Sample</title>
  <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
  <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
  <%= csrf_meta_tags %>
</head>
<body>

<%= yield %>

</body>
</html>

Btw, on your body, you have a close div without open

edited Dec 21 '16 at 01:33

answered Dec 21 '16 at 01:22

Duyet Nguyen

543
3
11

Hey, I added the opening body tag but still not working – TestUserNewDefault Dec 21 '16 at 01:25
Ah, you are wrong at `<%= stylesheet_link_tag 'default'`. I update my answer – Duyet Nguyen Dec 21 '16 at 01:31
I had to change to default becasue of an error, see http://stackoverflow.com/questions/28421547/rails-execjsprogramerror-in-pageshome – TestUserNewDefault Dec 21 '16 at 01:44
About the error above. I see many ways to resolved it without change `application` to `default`. Like [this](http://stackoverflow.com/questions/28882182/rails-coffeescript-typeerror-object-doesnt-support-this-property-or-method). But I suggest you should develop rails on linux or mac or [c9io](https://c9.io/) – Duyet Nguyen Dec 21 '16 at 01:50
Yeah rails seems to have a lot of error on windows, I think I might use linux – TestUserNewDefault Dec 21 '16 at 01:58

score 0 · Answer 2 · answered Dec 21 '16 at 01:47

0

I guess the problem with css that cannot be processed by turbolinks and makes rails crash.

Replace:

*= require_tree .
*= require_self

to:

/* ...
*= require_self
*= require_tree .
*/

and revert:

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

answered Dec 21 '16 at 01:47

num8er

18,604
3
43
57

Unfortunely when I try this I get an ExecJS::ProgramError in Posts#index error – TestUserNewDefault Dec 21 '16 at 01:56
@Carl `ExecJS::ProgramError` ? can You screenshot or put somewhere full body of error? – num8er Dec 21 '16 at 01:57

css not loading on rails

2 Answers2