Fix flag overwrites scss file content

[Shaderpixel]

In my scss file, I noticed that when I accidentally left some letters after the semicolon like so: color: red;asdf, gulp-stylelint would replace the entire scss file content with a report string when I set fix: true. My scss file after running gulp-stylelint, losing all of my scss styles:

[{"source":"assets/src/scss/components/_components.articles.scss","deprecations":[],"invalidOptionWarnings":[],"parseErrors":[],"errored":true,"warnings":[{"line":14,"column":33,"rule":"CssSyntaxError","severity":"error","text":"Unknown word (CssSyntaxError)"}]}]

I am not sure if its just my set up but I have tried postcss stylelint with the fix option set to true and it did not overwrite my entire file like gulp-stylelint did. It would be nice to get this fixed as gulp-stylelint has better reporting capabilities. Any ideas? Here's my gulp-stylelint task :

gulp.task('stylelint:newer', (done) => {
	$.pump([
		gulp.src(distPaths.scssGlob),
		customPlumber('Error Running esLint'),
		$.newer({dest: distPaths.scssDest}),
		$.stylelint({
			fix: true, 
			failAfterError: false,
			reportOutputDir: path.join(commonPaths.logPath, 'stylelint'),
			reporters: [
				{formatter: 'string', console: true},
				{formatter: 'verbose', save: 'report.txt'},
			],
			debug: true
		}),
		gulp.dest(distPaths.scssPath)
	], done);
});

[reinholdk]

Having the same issue when using the fix option. I'm using gulp 4.0.

[olegskl]

Hello. Sorry for being absent. I'll try to take a look at it when I have some time (hopefully this weekend).

[01taylop]

Hello, are you using any other plugins? The reason I ask is it could be a specific rule which is causing this issue.

I had the same problem you described so I removed all the rules after which I could no longer replicate the issue. I gradually added the rules back and narrowed my issue down to the stylelint-declaration-strict-value plugin.

I made the subsequent change to the config and no longer have the issue:

const stylelintStrictValueRules = {
  'scale-unlimited/declaration-strict-value': [
    ['/color$/'], {
-      disableFix: false,
+      autoFixFunc: () => null,
    },
  ],
}