'gulp sass not writing to destination directory

I've started using the gulp-sass 5. It's behaviour seems different from gulp-sass 4, requiring different configuration.

I've managed to figure out how to get it reading scss files. But I can't figure out how to get it to write them.

With the following config, no files are written to the './css' directory.

  function buildStyles() {
        return gulp.src('./sass/**.scss')
            .pipe(sass().on('error', sass.logError))
            .pipe(gulp.dest('./css'));
    };

How can I get sass to actually write the files?

gulpgulp-sass


Solution 1:[1]

You should define a task for compile sass files See here : Gulp Sass

gulpfile.js 

const gulp = require('gulp');
const sass = require('gulp-sass');
const del = require('del');

gulp.task('styles', () => {
    return gulp.src('sass/**/*.scss')
        .pipe(sass().on('error', sass.logError))
        .pipe(gulp.dest('./css/'));
});

gulp.task('clean', () => {
    return del([
        'css/main.css',
    ]);
});

gulp.task('default', gulp.series(['clean', 'styles']));

Solution 2:[2]

I had the same issue, By looking inside gulp-sass code, I figured out it's because the source file name starts with _

if (path.basename(file.path).startsWith('_')) {
  callback();
  return;
}
// ^ inside gulp-sass core js file

I'm not sure what purpose this serves but it seems like it was made intentionally to ignore files starting with _, renaming the files fixed it for me

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Hossein Azizdokht
Solution 2 Bilal Alam

Related Questions