Why Gulp doesn't create css file? - sass

Question

I have a problem because I've created task in gulpfiles.js but when I'm creating my file: .scss and then I write command gulp in bash. I have no errors, but there is no file in css folder. In my bash this code apeearing:
C:\Users\DOM\Desktop\react\my-react-project>gulp
[16:33:25] Using gulpfile ~\Desktop\react\my-react-project\gulpfile.js
[16:33:25] Starting 'watch_scss'...
[16:33:25] Finished 'watch_scss' after 13 ms
[16:33:25] Starting 'default'...
[16:33:25] Finished 'default' after 12 μs
This is my code from gulpfile.js :
'use strict';
//dependencies
var gulp = require('gulp');
var sass = require('gulp-sass');
var minifyCSS = require('gulp-clean-css');
var uglify = require('gulp-uglify');
var rename = require('gulp-rename');
var changed = require('gulp-change');
/////////////////////////////////
// - SCSS/CSS
////////////////////////////////
var SCSS_SRC = './src/Assets/scss/**/*.scss';
var SCSS_DEST = './src/Assets/css';
//Compile SCSS
gulp.task('compile_scss',function () {
gulp.src(SCSS_SRC)
.pipe(sass().on('error', sass.logError))
.pipe(minifyCSS())
.pipe(rename({suffix:'.min'}))
.pipe(changed(SCSS_DEST))
.pipe(gulp.dest(SCSS_DEST));
});
//Detect changes in SCSS
gulp.task('watch_scss', function(){
gulp.watch(SCSS_SRC, ['compile_scss']);
});
//Run tasks
gulp.task('default', ['watch_scss']);
I can't find where is my mistake.

Answer 1

In this line
var changed = require('**gulp-change**');
you should require gulp-changed,so this should work fine.
var changed = require('**gulp-changed**');
If you find this answer helpful please give thumbs up :)

Answer 2

gulp.watch would run your task 'compile_scss' only when you change file in dir defined in SCSS_SRC. Until gulp does not see any modifications in files there - gulp.watch would do nothing. Try gulp.task('default', ['compile_scss', 'watch_scss']);. And I recommend you to use gulp-syncplugin to make tasks 'compile_scss', 'watch_scss' run one after another, because if you modify your default task as I've recommended - these 2 tasks would run in parallel

Answer 3

I've changed previous code to this code:
var gulp = require('gulp');
//var jshint = require('gulp-jshint');
var sass = require('gulp-sass');
var uglify = require('gulp-uglify');
var rename = require('gulp-rename');
var minifyCSS = require('gulp-clean-css');
var SRC = './src/Assets/scss/**/*.scss';
var DEST = './src/Assets/css/';
gulp.task('styles', function() {
gulp.src(SRC)
.pipe(sass().on('error', sass.logError))
.pipe(minifyCSS())
.pipe(rename({suffix:'.min'}))
.pipe(gulp.dest(DEST));
});
//Watch task
gulp.task('default',function() {
gulp.watch(SRC,['styles']);
});
and everything works but I have no idea why.