stylelint + gulp-postcss doesn't work for subfolders

[alx-khramov]

I use gulp 3.9.1, gulp-postcss 6.2.0 and stylelint 7.6.0 for SCSS linting. OS is Ubuntu.
A related part of my gulp config looks like this:

var postcss = require('gulp-postcss');
var stylelint = require('stylelint');
var postcssReporter = require('postcss-reporter');
gulp.task('styles', function() {
  ...
  var lintProcessors = [
    stylelint(),
    postcssReporter({ clearMessages: true })
  ];

  gulp.src('app/assets_src/styles/**/*.scss')
    .pipe(postcss(lintProcessors, {syntax: scssSyntax}));
  ...
});

The problem:
Stylelint works great for files like app/assets_src/styles/file.scss
but it doesn't process files in subfolders like: app/assets_src/styles/blocks/home/file.scss Also the weird thing is that in some very rare times it fires once for such nested files, but then stops working again.
I've tried to use such paths:

app/assets_src/styles/**/**/*.scss
/app/assets_src/styles/**/*.scss
./app/assets_src/styles/**/**/*.scss

But no luck.

Using this cli command: stylelint 'app/assets_src/styles/**/*.scss' works good and processes subdirectories.
So maybe the issue is related to gulp-postcss.

[chrispelzer]

I'm running into the same issue. Though when I run my full gulp build gulp it works flawless everytime.

If I run just my task gulp stylelint it flucuates between 4-8 times it will work correctly.

No solution yet, but I'm assuming it's gulp-postcss, since like you I tried running it through the CLI and it's working perfectly as well. I'll look into it more this weekend.

Below is how my call to postcss and stylelint

        return gulp
            .src('resources/scss/**/*')
            .pipe(postcss([
                stylelint(),
                reporter({ clearMessages: true, throwError: false }),
            ], { syntax: scss }));
        )

[chrispelzer]

A little more information is this might be due to the stream module and the way it is handling globing those files.

When I thought gulp stylelint was working correctly within those 4-8 times, it actually wasn't. It was just getting further, but it was still missing 2 more partial scss files.

I found that out by console.log(file) within stream._transform = function (file, encoding, cb) {} at https://github.com/postcss/gulp-postcss/blob/master/index.js#L14 and it showed the majority of the files were ran through stylelint except the last 2 within the partial directory.

and again running the full gulp build instead of the individual gulp stylelint it's successful and goes through the entire file stream correctly.

[w0rm]

Hi! Thanks for the issue. Can you set up a minimal example that reproduces this issue and publish it on GitHub?

[chrispelzer]

I set up a repo at https://github.com/chrispelzer/testing-stylelint to test this out and it seems my issue might be more related to something going on with me extending the task for Laravel Elixir.

The master branch using just a gulp task with gulp-postcss, stylelint, reporter will go through all scss files and stylelint them correctly.

The gulp-debug will report that all files are being passed through for both branches when running gulp and gulp stylelint but only when running gulp stylelint on the elixir-postcss branch will it not stylelint all of the scss files, even though gulp-debug reports that it was part of the stream.

There are 2 branches

• master - gulp task with gulp-postcss, stylelint, reporter
• elixir-postcss (will not stylelint all files using gulp stylelint) - Laravel Elixir 6.0 Task with gulp-postcss, stylelint, reporter

[w0rm]

@chrispelzer you should probably listen to end event on the result stream, because the parent task runner may finish before the stream is done.

[alx-khramov]

@w0rm
Sorry for delay.
Here it is: https://github.com/alx-khramov/gulp-postcss-stylelint
All files in the 'styles' dir have errors. The gulp-debug shows that every file is being passed to the stylelint. But only some of them are being processed.
Don't understand which side causes the problem - stylelint or gulp-postcss, but stylelint works good if I use just cli.

[w0rm]

@alx-khramov you always have to return a stream from a gulp task, this way gulp understands when the task is terminated. Can you try if adding return to the line below fixes your problem?

return gulp.src(scssBasePath + '**/*.scss')

[alx-khramov]

@w0rm Yes. That fixed the problem on this demo, thanks. But on the actual project I have a more complicated config:
https://gist.github.com/alx-khramov/f7cf188fd5aeeb22aa5b2fba6d4c352d

And I don't see yet how I can just return a stylelint stream there. Also it's pretty not obvious how returning a stream is related to proper files processing, but thanks for the help anyway. I guess I need to rewrite the config.

[w0rm]

Also it's pretty not obvious how returning a stream is related to proper files processing

You can read about it in the gulp documentation: https://github.com/gulpjs/gulp/blob/master/docs/API.md#async-task-support