Context:
Hi, I am working on a website with a lot of reusable blocks each of which have a separate scss & js file.
In order to optimize performances, I've configured mix to output css in separated files so I can load them only if the corresponding block is present on the current page.
This is fine, except mix take more than 40 seconds to recompile now (instead of 6 seconds for a single output file) and this is slowing my work quite a bit...
Question:
How can I make mix compile faster in this situation, is it possible to recompile only the modified files ?
Are you using version() object? I think you can cache the version when this is not changing.
This is a very basic example and hope it helps.
/*
* JS
* */
mix.setResourceRoot('/public/assets/admin/')
.js('resources/js/app.js', 'public/assets/admin/')
.version();
/*
* Styles
* */
mix.styles([
'public/assets/admin/plugins/bootstrap/css/bootstrap.min.css',
'public/assets/admin/css/style.min.css',
], 'public/assets/admin/app.css');
mix.sass('resources/sass/app.scss', 'public/assets/admin/app.css').options({
postCss: [
require('autoprefixer'),
],
}).version();