title: 92% chunk asset optimization - webpack
body: <p>It seems that webpack gets stuck on
  <strong>92% chunk asset optimization</strong> for about 30+ seconds to show a simple js/css change. This is too long for anyone sane to sit and wait that much of their life  to see something that should be rendered near instantly.</p>
  
  <p>We're in development mode (so we need source maps, which add to the latency) but it should still NOT be 30+ seconds. Also, we're not using uglify (which I've seen mentioned on GitHub as taking up a good amount of time).</p>
  
  <p>How can we get the build time to be near instant, or much much faster than right now?</p>
  
  <p><strong>UPDATE</strong></p>
  
  <p>Here is the <code>laravel-mix</code> file:</p>
  
  <pre><code>let mix = require('laravel-mix');
  
  mix.react('resources/assets/js/app.js', 'public/js')
     .sass('resources/assets/sass/app.scss', 'public/css')
     .options({
       processCssUrls: false
     });
  
  mix.webpackConfig({
      // Note: First build will always be slower regardless
      // Here we're talking about rebuild time
  
      // If commented out, rebuild is ~6 secs
      // devtool: "inline-source-map",
  
      // If not commented out, rebuild is 30+ secs
      devtool: "inline-source-map",
  });
  </code></pre>
  
  <p>I found <code>inline-source-map</code> to be the best for quickest debugging, as it  provides the most detail on which line of error to fix in source, very very straight forward on what to fix where. I find other types are more cryptic in comparison and there is no indication of which line number to fix in source, so it takes much longer to debug.</p>
  
  <p>How do you guys do it? Is there a way to rebuild really fast while still being able to debug with the error line number in source to fix it (shown in chrome devtools console)?</p>