Obromios Obromios - 6 months ago 19
Javascript Question

Loading jquery datepicker stylesheet

I am using the

jquery datepicker
. If I put in my
application.css.scss
file

@import 'jquery-ui/datepicker';


the styles for the datepicker are not loaded.

But if I put

@import 'jquery-ui/datepicker.css';


the styles are loaded, but when I precompile my assets there is no digest file for
/assets/jquery-ui/datepicker.css

and so it is not included in the
application.css
digest in production. This means the styling does not working in production.

What is the correct way to import this file? I am using the
sassc
and
jquery-ui-rails
gems.

Answer

Make sure the following line is in your application.css

*= require jquery-ui/datepicker

Or, if you want to load all of jquery-ui, use the following:

*= require jquery-ui

Once you do that, it shouldn't be necessary to use a sass import so you can remove:

@import 'jquery-ui/datepicker.css';

If you are only using an application.css.scss file, then insert the *= require jquery-ui/datepicker into top part of the file so the result looks something like this

/*
*= require jquery-ui/datepicker
*= require_self
*/
Comments