CODEWITHSUNDEEP
csslaravelsasslaravel-elixir
Gijs Beijer
Gijs Beijer

Reputation: 624

Elixir not creating multiple css files

Tried to find an awnser to this question but could not find it here?

I'm using Laravel Elixir and got the following in my gulpfile:

mix.sass(['app.scss', 'admin.scss'], 'public/css');

Can someone tell me why it is not creating two css files but compiles it into one? How can I achieve it creating multiple files?

Thanks in Advance!

Upvotes: 1

Views: 1278

Answers (2)

Berci
Berci

Reputation: 41

yes the provided code almost did the trick, i wrote it a bit different though...

elixir(function(mix) {
  mix
    .sass('app.scss', './public/css/app.css')
    .sass('admin.scss', './public/css/admin.css');
});

but this atleast for me, didnt work till i started the normal gulp task, gulp watch wont create the new files :S

so stop watch and start the default gulp task with "gulp", after the files are created gulp watch will work again

Upvotes: 3

Bishal Paudel
Bishal Paudel

Reputation: 1946

The method to mix sass files is (https://github.com/laravel/elixir/blob/master/ingredients/sass.js):

/**
 * Prepare the Sass task.
 *
 * @param {string|array}  src
 * @param {string}        output
 * @param {object|null}   options
 * @param {bool}          useRuby
 */
var addSassTask = function(src, output, options, useRuby) {
    return compile({
        compiler: 'Sass',
        plugin: useRuby ? 'gulp-ruby-sass' : 'sass',
        pluginOptions: buildOptions(options, useRuby),
        src: src,
        output: output || elixir.config.cssOutput,
        search: '**/*.+(sass|scss)'
    });
};

You have,

mix.sass(['app.scss', 'admin.scss'], 'public/css');

Here, src = ['app.scss', 'admin.scss']

and output = 'public/css'

So you should combine a single file to the same file as output as :

mix.sass('app.scss', 'app.scss');
mix.sass('admin.scss', 'admin.scss');

Upvotes: 0

Related Questions