Using Gulp to Compile Sass and minify vendor css

Question

Getting to grips with Gulp and have a question.

So I have a gulp CSS task like the below which works just fine:

var sassDir = \'app/scss\';
var targetCss         


        

Answer 1

gulp-sass will meet your request. Pls let me show you how to compile Sass files and minify (or compress) compiled css files:

• install gulp-sass from here
• in you project's gulpfile.js, add following code:

Note: outputStyle in gulp-sass has four options: nested, expanded, compact, compressed

It really works, I have used it in my project. Hope it helps.

var gulp = require('gulp');
var sass = require('gulp-sass');

//sass
gulp.task('sass', function () {
    gulp.src(['yourCSSFolder/*.scss', 'yourCSSFolder/**/*.scss'])
        .pipe(sass({outputStyle: 'compressed'}))
        .pipe(gulp.dest('yourCSSFolder/'));
});

// Default task
gulp.task('default', function () {
    gulp.start('sass');
});

For reminder the readme