laravel-mix: Slow compilation of SCSS

I experienced a significant performance decrease with SCSS compilation when moving from Elixir to Mix. I wanted to ask if anyone has the same issue?

I do not have one project where I can test the performance of both solutions but I have quite similar setup on two different.

The main difference is VueJS version but the JS compilation is quite fast for both. On both projects I use Bootstrap 3 and here are some numbers:

Laravel Mix without watching:

• Whole process: 45 seconds
• Only SCSS compilation(js commented out): 37 seconds

Laravel Mix with watching:

• Initial full compilation(with JS): 36 seconds
• SCSS and JS recompilation: 16 seconds
• Initial SCSS only compilation: 32 seconds
• Only SCSS recompilation: 15 seconds

Just a notice: All of the 15-16 seconds of SCSS recompilation, the console output is stuck at:

10% building modules 0/1 modules 1 active ...crm_cc\resources\assets\sass\app.scss

Laravel Elixir without watching:

• Whole process: SASS 1.84s, Webpack 8.8s, all 11s
• Only SCSS compilation: 1.89s

Laravel Elixir with watching:

• Initial full compilation: 1.26s
• SCSS and JS recompilation: ~40ms(Elixir doesn’t show Webpack compilation time)
• Initial SCSS only compilation: ~600ms
• Only SCSS recompilation: 30-40ms

The changes I did to make it recompile was to add or remove one empty line either in app.scss or app.js.

I tried one project with Bulma framework and the compilation was a little bit faster but it’s still ages compared to what I experienced with Elixir.

If you want me to investigate this further, I can setup two identical projects and test it properly.

Versions:

• Node: 6.9.5
• NPM: 3.10.10
• Elixir: 6.0.0-15
• Mix: 0.8.8(recently updated from 0.5.* with no difference in performance)
• node-sass: 3.13.1 for Elixir, 4.5.0 for Mix
• OS: Windows 10

Running yarn run watch or npm run watch makes no difference, but if it helps I have yarn@0.21.3