Switch to laravel-mix

[QWp6t]

Ideally I'd like to check these boxes before merging.

The following still needs to be fixed/added...

• support for css injection (it injects, but then reloads anyway)
• support for js injection + hmr (not super important, tbh)
• vendor extractions for supported presets (bootstrap, foundation, etc)
• restore support for user-defined cache-busting naming convention (e.g., [name]_[hash:8])

The following still needs to be tested (these should be simple to test, i just didn't do it yet)...

• watch mode: adding background image (does image copy to dist?)
• watch mode: removing background image (does image get removed from dist?)
• copied images that aren't referenced in css/js should get cache-busted
• source maps

[QWp6t]

Just to keep everyone in the loop, we're hesitant to merge this now because preliminary benchmarks are showing that laravel-mix is significantly slower at compiling compared to our current setup. I'm not sure exactly what's different. I'm looking into it. But we're talking about differences of 10-20s, far too substantial to ignore.

[dmgawel]

@QWp6t CSS URL processing in Mix is known for its slow performance in some cases. Did you tried with this option disabled? laravel-mix/laravel-mix#49 (comment)

[retlehs]

Yes, that didn’t help

…

Sent from my iPhone

On Dec 31, 2017, at 9:03 AM, Dawid Gaweł ***@***.***> wrote: @QWp6t CSS URL processing in Mix is known for its slow performance in some cases. Did you tried with this option disabled? laravel-mix/laravel-mix#49 (comment) — You are receiving this because you commented. Reply to this email directly, view it on GitHub, or mute the thread.

[myleshyson]

This looks awesome so far! Just out of curiosity though, are the benchmarks based off just the initial install of sage or are you using a sample project? When I pulled in the laravel-mix branch I found that there isn't much difference in compiling time, but then again I'm just using the base sage theme.

It seemed like currently there were two seperate scripts running with the laravel-mix branch: npm lint -s and then the build script. When I removed that pre-build script and replaced it by adding eslint and styleint to the webpack configuration, it seemed to start compiling faster.

Here's the compiling times on my laptop.

Build Script	Laravel Mix	Sage Setup
build	6793ms	1623ms
build:production	18734ms	18354ms
start (initial)	4413ms	6578ms
start (small css change)	2749ms	3207ms

The only major difference for me was the build script which I don't use much anyway.

After this test I also removed the jquery imports from both customizer.js and main.js, since webpack autoloads that to every file anyway. That also seemed to speed up the compiling a little bit as well. I hope this helps!

[apintocr]

Actually this is amazing.
I'd say many of Sage 9 devs are also working with Laravel, this will put the workflows even closer together.

I've tested and it worked without any issues out of the box.

[wilburpowery]

Any ETA on this change being merged?

[retlehs]

webpack 4 support has landed in #2122. laravel mix might be waiting until webpack 5? this PR is stale and might be revisited in the future (or we might consider another package similar to mix)

[wilburpowery]

Yes, Jeffrey Way will wait until Webpack 5 before updating @retlehs.