Gulp-sass: not working with gulp 4.0

[TeodorKolev]

Task did not finish Starting gulpSass...

var gulp = require('gulp');
var sass = require('gulp-sass');

var paths = {
  sass:    'src/css/**/*.scss',
 };
gulp.task('sass', function () {
  return sass(paths.sass)
    .on('error', sass.logError)
    .pipe(gulp.dest('src/css'));
});
function watch() {
  livereload.listen();
  ...
  gulp.watch(paths.sass, sass);
}

gulp.task('build',  gulp.parallel(sass, ... watch));

gulp.task('default', gulp.series('build'));

[Keats]

You need to use gulp.src, here's the task I've been using with gulp 4 for months now

var sassFiles = "src/style/**/*.scss"

gulp.task("sass", function() {
  return gulp.src(sassFiles)
    .pipe(sass({outputStyle: "compressed"}).on("error", sass.logError))
    .pipe(autoprefixer())
    .pipe(gulp.dest(outputFolder))
});

[TeodorKolev]

That makes absolute no difference. Just tested, btw 10x for the quick response. Task is starting and thats it. When I change sass file it start again and never finish. Gulp is version 4. Please test and if you find why tasks not finish share here. Thanks

[TeodorKolev]

Plsease test and don't close issues like that

'use strict';

var gulp = require('gulp');
var sass = require('gulp-sass');

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

gulp.task('sass:watch', function () {
  gulp.watch('src/**/*.scss', ['sass']);
});


gulp.task('build', gulp.series(
  gulp.parallel(sass)
));

gulp.task('default', gulp.series('build'));

[Keats]

The above works for me (minus the gulp 4 incompatibility: gulp.watch('src/*_/_.scss', ['sass']); ).

I've tried on one of my repo (https://github.com/Keats/snowflake) and I don't get any error and everything finishes correctly. Let me know if my repo works for you and otherwise please provide a sample repo that reproduces the error

[ghost]

@Keats been using this with gulp 4 and it works fine. This is an issue with his tasks.

@TeodorKolev

this is wrong

gulp.task('build', gulp.series(
  gulp.parallel(sass)
));

should be

gulp.task('build', gulp.series('build, 'watch:sass'));

and

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

should be

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

You need to have return and done for tasks that do not run async.

@Keats You can close this, this is an issue with his gulp tasks.

[Zork33]

I’ve being using gulp-sass since Apr 2015, and it perfectly worked with up to NodeJS 0.2.12 Once I’ve switched to NodeJS 4.2.2 – I’ve faced with very close problem. Gulp-sass task starts and then nodejs stop working.

To be clear, I've made a test based on a code from this thread. It’s CoffeeScript:

gulp = require 'gulp'
sass = require 'gulp-sass'

sassFiles = './src/sass/**/*.sass'

gulp.task 'default', (->
  return gulp.src(sassFiles)
  .pipe(sass(outputStyle: "compressed").on("error", sass.logError))
  .pipe(gulp.dest('./build')))

and this what I see in console:

C:\Work\TestProj>gulp
[21:21:38] Using gulpfile C:\Work\TestProj\gulpfile.js
[21:21:38] Starting 'default'...
C:\Work\TestProj>

I'm working on Window7 x64. Could that be a problem?

Any idea how I could get more details from nodejs why gulp-sass kills it?

[Zork33]

I’ve found specific reason why my nodejs 4.2.2 was crashing with my sass files. It was the fact that I was calling Susy @include container prior of calling @include layout. And now gulp-sass perfectly works for me on NodeJS 4.2.2. So, my issue is closed

In general, it’s still interesting why sass code can silently crash nodejs. I believe this question is for node-sass project.

[xzyfer]

Could you please create a sample sass file I can test with. We should fix
this crash in LibSass.
On 13 Nov 2015 11:39 pm, "Alexey Zorkaltsev" [email protected]
wrote:

I’ve found specific reason why my nodejs 4.2.2 was crashing with my sass
files. It was the fact that I was calling Susy @include
https://github.com/include container prior of calling @include
https://github.com/include layout. And now gulp-sass perfectly works
for me on NodeJS 4.2.2. So, my issue is closed

In general, it’s still interesting why sass code can silently crash
nodejs. I believe this question is for node-sass project.

—
Reply to this email directly or view it on GitHub
https://github.com/dlmanning/gulp-sass/issues/383#issuecomment-156637940
.

[Zork33]

https://github.com/Zork33/libsass-bug - simple project that demonstrates the problem

[JimBobSquarePants]

@xzyfer

Using concatenation rather than interpolation can cause it to crash out also.

Bad

background: url($img-url + "/icons/icon-play.png") 0 0 no-repeat;

Good

background: url("#{$img-url}/icons/icon-play.png") 0 0 no-repeat;

[xzyfer]

@JimBobSquarePants good news this appears to be fixed. Try the latest node-sass.

[xzyfer]

@Zork33 I can confirm this does segfault. Unable to create a reduced test cases of yet.

[xzyfer]

@Zork33 OK I have a minimal reproduction now. Thanks heaps for creating that repo!

@mixin foo($bar...) {
  @each $item in $bar {
  }
}

@include foo(());

I believe this a duplicate of https://github.com/sass/libsass/issues/1709

[JimBobSquarePants]

Thanks @xzyfer . Great to hear!

[loganhenson]

@TeodorKolev I wanted to post the actual issue (in case you hadn't resolved it)..

You are actually calling gulp-sass (the npm module, which is not a gulp task) directly, instead of the sass task. Try naming you sass task something different and it will complete properly. Hope that helps anyone who made the same mistake and ends up here!

[fyddaben]

i have the same question .start sass .and never finished

[fyddaben]

i update my node-sass to 3.2.5 . and slove it . It waste one night time......

[glen-84]

Why is this issue still open?

[glen-84]

Actually, the code in the README needs to be updated, as it doesn't return the stream.

[xzyfer]

We're open to pull requests.
On 11 Dec 2015 9:05 pm, "Glen" [email protected] wrote:

Actually, the code in the README needs to be updated, as it doesn't return
the stream.

—
Reply to this email directly or view it on GitHub
https://github.com/dlmanning/gulp-sass/issues/383#issuecomment-163896852
.

[Keats]

408 should solve that

[glen-84]

Ah, I forgot about your PR. So this can be closed then?