vscode-live-sass-compiler icon indicating copy to clipboard operation
vscode-live-sass-compiler copied to clipboard

Issue with css grid (ie) and live sass compiler autoprefix

Open ghost opened this issue 5 years ago • 8 comments

Hi everyone, In the setting.json of my workspace (vscode editor) I set liveSassCompile.settings.autoprefix to defaults, that keyword support also Ie 11.

###Now for example we have this code:

.hero { grid-template-columns: repeat(2,1fr); }

###When we compile it, we will have:

.hero { -ms-grid-columns: (1fr)[2]; grid-template-columns: repeat(2, 1fr); }

And vscode tell me that is an error ] expected.

How I can resolve that? That behavior fills my stylesheet with a lot of errors.

ghost avatar Jan 12 '20 17:01 ghost

I think the problem is that this plugin is using an old sass.js version that hasn't updated since 2018.

If someone can update this project, it would be nice. Sadly I can't code.

My fix, for now, is to replace all the "repeats" with fully stated values. So instead of .hero { grid-template-columns: repeat(2,1fr); }

You need .hero { grid-template-columns: 1fr 1fr; }

Otherwise, find a new way to compile scss

Flexxkii avatar Feb 10 '20 09:02 Flexxkii

You can install Dart SASS through this article https://stackoverflow.com/questions/51571814/how-to-install-dart-sass/52063522

you don't need Live Sass Compiler now and there are no issues because you can use latest Sass

frixaco avatar Feb 17 '20 12:02 frixaco

New way to compile scss: Installed Dart SASS through this article https://stackoverflow.com/questions/51571814/how-to-install-dart-sass/52063522

Now it's much easier to compile. I don't need Live Sass Compiler and there are no issues because you can use latest Sass

Hey thanks, gonna research that.

But I just learned NodeJS and NPM and used Gulp to automate the process. Every time I save a .scss file it's gonna process it and minify it and with another package it also autoprefixes css properties

So I think that I'm going to stick with this.

Flexxkii avatar Feb 17 '20 13:02 Flexxkii

can confirm it break grid-template-columns and i moved all my workflow to gulp-sass.

noxasch avatar Feb 20 '20 12:02 noxasch

Ok, thank you guys, Do you think that I have to close the issue (because there is no solution) or keep it open?

ghost avatar Feb 28 '20 21:02 ghost

Let it open for now since it isn't actually fixed and the solution would be to add updated autoprefixer to this compiler. Which shouldn't be hard to do.

Flexxkii avatar Feb 29 '20 13:02 Flexxkii

I had the same error today, so annoying

rafatavares03 avatar Oct 03 '21 15:10 rafatavares03

any news to this issue?

carljustineoyales avatar Mar 06 '22 01:03 carljustineoyales