Cacher is the code snippet organizer for pro developers

// GULP CONFIG

// DEPENDENCIES
	// general
	var gulp = require('gulp');
	// css
	var sass = require('gulp-sass');
	var minifycss = require('gulp-minify-css');
	var autoprefixer = require('gulp-autoprefixer');
	var rename = require("gulp-rename");
	// error handling with notify & plumber
	var notify = require("gulp-notify");
	var plumber = require('gulp-plumber');
	// watch
	var watch = require('gulp-watch');

// TASKS
	// css frontend
	gulp.task('css_frontend', function() {
			gulp.src('assets/style_frontend.scss')
			.pipe(plumber({errorHandler: notify.onError("<%= error.message %>")}))
			.pipe(sass())
			.pipe(autoprefixer('last 2 version', { cascade: false }))
			.pipe(minifycss())
    	.pipe(rename('dist/style_frontend.min.css'))
			.pipe(gulp.dest('./'));
	});

	// css backend
	gulp.task('css_backend', function() {
			gulp.src('assets/style_backend.scss')
			.pipe(plumber({errorHandler: notify.onError("<%= error.message %>")}))
			.pipe(sass())
			.pipe(autoprefixer('last 2 version', { cascade: false }))
			.pipe(minifycss())
    	.pipe(rename('dist/style_backend.min.css'))
			.pipe(gulp.dest('./'));
	});

	// watch frontend
	gulp.task('watch_frontend', function() {
	  gulp.watch('assets/style_frontend.scss', ['css_frontend']);
	});

	// watch backend
	gulp.task('watch_backend', function() {
	  gulp.watch('assets/style_backend.scss', ['css_backend']);
	});

// RUN DEFAULT
gulp.task('default', ['watch_frontend', 'watch_backend']);


// NOTE, THE FOLLOWING should get you `style_frontend.min.css` and `style_backend.min.css` files in your `dist` folder. You'll process ​_both_​ when ​_either_​ changes, but you reduce it down to one task, and you don't have to rewrite all your tasks when you add a new SCSS file
// REMOVE:
/* 
.pipe(rename('dist/style_frontend.min.css'))
            .pipe(gulp.dest('./'));
*/
// REPLACE WITH
/*
.pipe(gulp.dest('./dist'));
*/
// that way you just have one `gulp watch` task that watches `assets/**.scss`