rails DataTables CSS doesn't get applied in Production mode

Question

I'm using Rails 5 with the jquery-datatables-rails (3.4.0, latest) gem.

CSS on the tables renders fine in development mode. I can walk through the CSS and see it well formed like:

http://localhost:3000/assets/dataTables/jquery.dataTables.self-MD5.css?body=1

However, in Production mode, no styling whatsoever is applied. CSS all gets 'precompiled' or munged into: http://my.ip/assets/application-MD5.css

Chrome can load the remote application-.css file. I verified that a couple of CSS classes appear in both the development mode assets/dataTables/jquery.dataTables..css AND production mode assets/application*.css. Like,

/* line 265, /Users/rb/.rvm/gems/ruby-2.3.1@flv/gems/jquery-datatables-rails-3.4.0/app/assets/stylesheets/dataTables/jquery.dataTables.scss */
table.dataTable,
table.dataTable th,
table.dataTable td {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}

I found a corresponding 'table.dataTable td' in production application*.css and it looks correct!

But Chrome and Firefox refuse to render them. What am I doing wrong? This is in app/assets/stylesheets/application.css:

*= require_tree .
 *= require dataTables/jquery.dataTables
 *= require jquery-ui
 *= require_self

and this is in production mode's rendered head tag:

<link rel="stylesheet" media="all" href="/assets/application-MD5.css" data-turbolinks-track="reload" />

How it looks in dev mode with Chrome Inspector: imgur.com/a/4uoaq How it looks in Prod mode with no CSS styling: imgur.com/a/s9p54 I just tried upgrading jquery-ui-rails to 6.0.1 , it had no impact. — rajat banerjee
– rajat banerjee, Commented Dec 26, 2016 at 0:46
One very ghetto solution I did that worked but that i dislike, include this in layouts/application.html.erb: <link rel="stylesheet" media="all" href="cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css" /> — rajat banerjee
– rajat banerjee, Commented Dec 26, 2016 at 16:20

rajat banerjee · Accepted Answer · 2017-01-25 22:06:23Z

0

Solution that finally worked:

Create a throw-away new project, rails new fakeProject
Copy all rake assets pipeline settings out of fakeProject/config/environments/production.rb into my projects config/environments/production.rb
push to git, deploy with capistrano
clear cache in chrome, restart puma, see css styling, profit$$$

Unfortunately one of the settings I'd used for rails asset pipeline was killing me. I never figured out which one and just nuked them.

answered Jan 25, 2017 at 22:06

rajat banerjee

1,3042 gold badges13 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

rails DataTables CSS doesn't get applied in Production mode

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related