sass file not compiled by gulp - css

Question

I want to switch from less to sass so I installed gulp-sass with npm and modified my gulpfile to compile sass instead of less (nothing else changed). Sadly gulp doesn't compile my .scss file to css and after googling and trying all i could think of it still doesn't compile. Here are all the informations I can show you:
gulpfile.js
// GULP CONFIG
// REQUIRES
// 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");
// watch
var watch = require('gulp-watch');
// TASKS
// css
gulp.task('css', function() {
gulp.src('style.css') // get the 'all-import' css-file
// .pipe(sass({includePaths: ['./styles']}))
// .pipe(sass().on('error', sass.logError))
.pipe(sass()) // sass to css
.pipe(autoprefixer('last 2 version', { cascade: false })) // autoprefix
.pipe(minifycss()) // minify
.pipe(rename('style.min.css')) // rename to style.min.css
.pipe(gulp.dest('')); // output to root
});
// watch
gulp.task('watch', function() {
gulp.watch('styles/*', ['css']);
});
// RUN DEFAULT
gulp.task('default', ['watch']);
related Folders & Files
├── style.min.css
├── style.css (with #import styles/style.scss)
│ └── styles
│ ├── style.scss
terminal response:
starting gulp:
[10:19:14] Starting 'watch'...
[10:19:14] Finished 'watch' after 11 ms
[10:19:14] Starting 'default'...
[10:19:14] Finished 'default' after 20 μs
after saving style.scss
[10:19:20] Starting 'css'...
[10:19:20] Finished 'css' after 15 ms
style.scss (content on purpose of testing obviously)
$color: #99cc00;
body {
background-color: $color;
.sub {
color: $color;
}
}
style.min.css after running through gulp
$color:#9c0;body{background-color:$color;.sub{color:$color}

Answer 1

You are not telling gulp to watch for sass file. On this line:
gulp.src('style.css')
You are specifying a css file, not a scss file. Change it to :
gulp.src('style.scss') // update, s missing
Also, there is no output route specified. This line:
.pipe(gulp.dest(''));
Should contain your destiny route, and its currently empty.
So, for the root route, something like this should work:
.pipe(gulp.dest('./')); // or whatever route you want
Anyway, your file structure is a bit weird.
In my opinion, you should create different folders for sass files and compiled ones.
Hope this puts you on the right track.