How to build multiple css files?

This works:

mix
  .js('assets/js/admin.js', 'dist/js/')
  .js('assets/js/frontend.js', 'dist/js/')
;

However, this doesn’t:

mix
  .sass('assets/sass/admin.scss', 'dist/css/')
  .sass('assets/sass/frontend.scss', 'dist/css/')
;

It results in the following error:

Error: Laravel Mix: Limit your “mix.sass()” calls to one.

Is this a bug or an intended limitation?

[JeffreyWay]

I just pushed support for this to master. Hasn’t been tagged yet, but will soon. So you can soon do:

mix.js('resources/assets/js/app.js', 'public/js')
   .sass('resources/assets/sass/app.scss', 'public/css')
   .sass('resources/assets/sass/other.scss', 'public/css')

And that will create public/css/app.css and public/css/other.css.

[pmua]

let mix = require('laravel-mix');

function mix_scss_files(folder) {
    let fs = require('fs');
    var relative_path = "resources/assets/sass" + folder;
    var paths = fs.readdirSync(relative_path);
    for (var i = 0; i < paths.length; i++) {
        if (paths[i].indexOf('.scss') > 0 && paths[i].charAt(0) != '_') {
            var file_path = relative_path + paths[i];
            console.log(file_path);
            mix.sass(file_path, 'public/css' + folder);
        }
    }
}
// sass root folder
mix_scss_files('/');
// sass subfolder resources/assets/sass/custom , trailing slash is necessary
mix_scss_files('/custom/');

mix.js('resources/assets/js/app.js', 'public/js');