title: how to implement jQuery Datepicker into Rails 5.1 app
body: <p>I'm trying to implement jQuery Datepicker into my Rails 5.1.3 app, but I get this error message:</p>
  
  <blockquote>
    <p>ActionView::Template::Error at /users/2/absences/new File to import
    not found or unreadable: jquery-ui/widgets/datepicker. Load paths:<br>
    /Users/acandael/Sites/absence_registrator/app/assets/config<br>
    /Users/acandael/Sites/absence_registrator/app/assets/images<br>
    /Users/acandael/Sites/absence_registrator/app/assets/javascripts<br>
    /Users/acandael/Sites/absence_registrator/app/assets/stylesheets</p>
  </blockquote>
  
  <p>I have added the jquery-ui-rails gem to the Gemfile</p>
  
  <p>Then I configured the app/assets/javascripts/application.js file:</p>
  
  <pre><code>//= require jquery-ui/widgets/datepicker
  </code></pre>
  
  <p>and I also configured the app/assets/stylesheets/application.scss file:</p>
  
  <pre><code>@import "jquery-ui/widgets/datepicker";
  </code></pre>
  
  <p>finaly I configured the Datepicker in the view template:</p>
  
  <pre><code>&lt;%= f.text_field :date, class: "form-control", id: "datepicker" %&gt;
  
  &lt;script&gt;
   $(function() {
   $( "#datepicker" ).datepicker();
   });
  &lt;/script&gt;
  </code></pre>
  
  <h2>Update</h2>
  
  <p>I made some progress by changing</p>
  
  <pre><code>//= require jquery-ui/widgets/datepicker
  </code></pre>
  
  <p>to</p>
  
  <pre><code>//= require jquery-ui/datepicker
  </code></pre>
  
  <p>in app/assets/javascripts/application.js</p>
  
  <p>In app/assets/stylesheets/application.scss</p>
  
  <p>I changed </p>
  
  <pre><code>@import "jquery-ui/widgets/datepicker";
  </code></pre>
  
  <p>to </p>
  
  <pre><code>/*
   *= require jquery-ui/datepicker
  */
  </code></pre>
  
  <p>but the Datepicker that appears is not styled.</p>
  
  <p>So my question now is how implement css styling for the Datepicker</p>
  
  <h2>Update</h2>
  
  <p>I fixed the styling issue by importing:</p>
  
  <pre><code>@import 'jquery-ui/datepicker.css';
  </code></pre>
  
  <p>into app/assets/stylesheets/application.scss</p>
  
  <p>Thanks for your help,</p>
  
  <p>Anthony</p>