title: Webpacker can't find stylesheets/application.css
body: <p>I am using Ruby on Rails with webpacker.</p>
  
  <p>The webpacker setup runs just fine, I already installed jQuery, Bootstrap 4, and Font Awesome.</p>
  
  <p>My webpacker directory currently looks like this:</p>
  
  <ul>
  <li><code>app/javascript/packs/javascripts/application.js</code></li>
  <li><code>app/javascript/packs/stylesheets/application.scss</code></li>
  <li><code>app/javascript/packs/stylesheets/base.scss</code></li>
  </ul>
  
  <p>In my <strong>application.html.erb</strong> file:</p>
  
  <pre><code>...
  &lt;%= javascript_pack_tag 'javascripts/application', 'data-turbolinks-track': 'reload' %&gt;
  &lt;%= stylesheet_pack_tag 'stylesheets/application' %&gt;
  ...
  </code></pre>
  
  <p>In my <strong>application.js</strong> file:</p>
  
  <pre><code>import 'bootstrap/dist/js/bootstrap';
  </code></pre>
  
  <p>In my <strong>application.scss</strong> file:</p>
  
  <pre><code>$fa-font-path: '~font-awesome/fonts';
  @import '~font-awesome/scss/font-awesome';
  @import '~bootstrap/scss/bootstrap';
  @import 'base';
  </code></pre>
  
  <p>I am currently putting my custom CSS in <strong>base.scss</strong> file and it works just fine.</p>
  
  <p>I want to use a Bootstrap 4 Template more specifically this template <strong><a href="https://github.com/BootstrapDash/PurpleAdmin-Free-Admin-Template" rel="nofollow noreferrer">PurpleAdmin</a></strong>. It has a custom CSS that has over 20K+ lines of code which you may see <strong><a href="https://github.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/blob/master/css/style.css" rel="nofollow noreferrer">here</a></strong>.</p>
  
  <p>Whenever I tried to copy and paste the CSS codes in my <strong>base.scss</strong>, webpacker raises an error <code>Webpacker can't find stylesheets/application.css</code>.</p>
  
  <p>But I write my own CSS in the <strong>base.scss</strong>, it compiles just fine. I also tried putting the template's custom CSS in the sprockets (<code>app/assets/stylesheets/base.scss</code>) and it works just fine. </p>
  
  <p>I also tried importing the CSS directly in my html.erb file like <code>&lt;link rel='stylesheet' href='http://www.bootstrapdash.com/demo/purple-admin-free/css/style.css'&gt;</code> and also works just fine.</p>
  
  <p>Why doesn't it work using Webpacker? As I want to drop using sprockets from now.</p>