question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

stylelint + gulp-postcss doesn't work for subfolders

See original GitHub issue

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.

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Comments:9 (4 by maintainers)

github_iconTop GitHub Comments

2reactions
chrispelzercommented, Dec 2, 2016

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 }));
        )
0reactions
w0rmcommented, Dec 14, 2016

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

Read more comments on GitHub >

github_iconTop Results From Across the Web

stylelint + gulp doesn't work for subfolders
The answer is - you always have to return a stream from a gulp task, this way gulp understands when the task is...
Read more >
PostCSS plugin
We recommend you lint your CSS before applying any transformations. You can do this by either: creating a separate lint task that is...
Read more >
Stylelint: The Style Sheet Linter We've Always Wanted
This command will lint all CSS files in the styles directory and any of its subdirectories. If it's not specified explicitly, stylelint will ......
Read more >
postcss/postcss - Gitter
Hi. Can I put postcss.config.js in project subdirectory? How can I put...?
Read more >
Building an Enterprise React Application, Part 2
It can replicate the things Sass and Less do, but it doesn't make assumptions ... I alluded to stylelint above when I discussed...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found