Why is task not working in Gulp?

Question

css

The debug:build task doesn't want to run. Tried two file gluers gulp-rigger and gulp-file-include. The first one works fine, but there is no way to include files of different extensions, namely css in scss. With the second, each task included in debug:build works fine individually, but debug:build doesn't want to work. And what other ways are there to include css in scss? Just like a piece of code, so that there is one file at the output.
Gulpfile.js piece:

var gulp = require('gulp'),   //Подключаемые пакеты
    watch = require('gulp-watch'),
    sourcemaps = require('gulp-sourcemaps'),
    sass = require('gulp-sass'),
    prefixer = require('gulp-autoprefixer'),
    uglify = require('gulp-uglify'),
//    rigger = require('gulp-rigger'),
    fileinclude = require('gulp-file-include'),
    cssmin = require('gulp-csso'),
    htmlmin = require('gulp-htmlmin'),
    imagemin = require('gulp-imagemin'),
    clean = require('gulp-clean'),
    browserSync = require('browser-sync'),
    reload = browserSync.reload,
    include = fileinclude({
      prefix: '@@',
      basepath: '@file'
    });

var path = { //Рабочая папка с сайтом
  demo: { //Дебаг версия
    root: 'demo/',
    html: 'demo/',
    css: 'demo/styles/',
    js: 'demo/js/',
    img: 'demo/img/',
    fonts: 'demo/fonts/'
  },
  src: { //Исходники
    root: 'src/',
    html: 'src/',
    css: 'src/styles/',
    js: 'src/js/',
    img: 'src/img/',
    fonts: 'src/fonts/'
  },
  release: { //Финальная версия с минифицированными файлами
    root: 'release/',
    html: 'release/',
    css: 'release/styles/',
    js: 'release/js/',
    img: 'release/img/',
    fonts: 'release/fonts/'
  },
  watch: { //Папки и файлы для наблюдения
    html: 'src/**/*.html',
    css: 'src/styles/**/*.*',
    js: 'src/js/**/*.*',
    img: 'src/img/**/*.*',
    fonts: 'src/fonts/**/*.*'
  }
};
gulp.task('html:build', function () {
  gulp.src(path.src.html + '**/*.html')
      .pipe(sourcemaps.init())
      .pipe(include)
      .pipe(sourcemaps.write())
      .pipe(gulp.dest(path.demo.html))
      .pipe(reload({stream: true}));
});

gulp.task('js:build', function () {
  gulp.src(path.src.js + '**/*.js')
      .pipe(sourcemaps.init())
      .pipe(include)
      .pipe(sourcemaps.write())
      .pipe(gulp.dest(path.demo.js))
      .pipe(reload({stream: true}));
});

gulp.task('style:build', function () {
  gulp.src(path.src.css + '**/*.scss')
      .pipe(sourcemaps.init())
      .pipe(include)
      .pipe(sass())
      .pipe(prefixer())
      .pipe(sourcemaps.write())
      .pipe(gulp.dest(path.demo.css))
      .pipe(reload({stream: true}));
});

gulp.task('image:min', function () {
  gulp.src(path.src.img + '**/*.*')
      .pipe(imagemin({
        progressive: true,
        svgoPlugins: [{removeViewBox: false}]
      }))
      .pipe(gulp.dest(path.demo.img))
      .pipe(reload({stream: true}));
});

gulp.task('fonts:build', function() {
  gulp.src(path.src.fonts + '**/*.*')
      .pipe(gulp.dest(path.demo.fonts))
});

gulp.task('clean', function () {
  gulp.src(path.demo.root + '*')
      .pipe(clean());
  gulp.src(path.release.root + '*')
      .pipe(clean());
});

gulp.task('debug:build', [
    'clean',
    'html:build',
    'style:build',
    'js:build',
    'image:min',
    'fonts:build'
]);

-------------
Forgot to attach error:

"C:\Program Files (x86)\JetBrains\WebStorm 11.0.3\bin\runnerw.exe" "C:\Program Files\nodejs\node.exe" C:\Users\serj-\AppData\Roaming\npm\node_modules\gulp\bin\gulp.js --color --gulpfile w:\Dropbox\WEB\ivan\Gulpfile.js debug:build
[22:27:39] Using gulpfile w:\Dropbox\WEB\ivan\Gulpfile.js
[22:27:39] Starting 'clean'...
[22:27:39] Finished 'clean' after 11 ms
[22:27:39] Starting 'html:build'...
[22:27:39] Finished 'html:build' after 3.33 ms
[22:27:39] Starting 'style:build'...
[22:27:39] Finished 'style:build' after 1.44 ms
[22:27:39] Starting 'js:build'...
[22:27:39] Finished 'js:build' after 917 μs
[22:27:39] Starting 'image:min'...
[22:27:39] Finished 'image:min' after 1.26 ms
[22:27:39] Starting 'fonts:build'...
[22:27:39] Finished 'fonts:build' after 504 μs
[22:27:39] Starting 'debug:build'...
[22:27:39] Finished 'debug:build' after 2.46 μs
[22:27:39] gulp-imagemin: Minified 0 images

events.js:141
      throw er; // Unhandled 'error' event
      ^
Error: demo\js\contacts.html
Error: Invalid CSS after "": expected 1 selector or at-rule, was "<!DOCTYPE html>"
        on line 1 of stdin
>> <!DOCTYPE html>
   ^

    at options.error (w:\Dropbox\WEB\ivan\node_modules\node-sass\lib\index.js:277:32)

Process finished with exit code 1

Answer 1

Maybe I misunderstood something, but it is logical to assume that:
1. We do css
2. And then we include it in Html.
From here, there are already 2 suspicious points:
1. style:build must work before html:build, otherwise it will not know about the files
2. You can put html:build in style:build dependencies, then they would be executed in the right sequence, i.e. .:

gulp.task('html:build', ['style:build','js:build','image:min','fonts:build'], function () {
  gulp.src(path.src.html + '**/*.html')
      .pipe(sourcemaps.init())
      .pipe(include)
      .pipe(sourcemaps.write())
      .pipe(gulp.dest(path.demo.html))
      .pipe(reload({stream: true}));
});

Well, the last thing, if I understood the goal correctly, then for throwing files into the stream, the most convenient is gulp-add-src

Answer 2

turn everything off, then turn it on one at a time, until it starts to blunt. standard practice