search

styled-components / vscode-styled-components

Syntax highlighting for styled-components
MIT License
918 stars 117 forks source link

Highlight conflict with PostCSS Extension #372

Open Evaldo-JR opened 2 years ago

Evaldo-JR commented 2 years ago

I'm having problems using 2 extensions together: PostCSS and Styled-Components. If both are enabled, highlighted colors give priority to PostCSS even if I write with Styled-Components syntax.

Is there any way I can configure the VSCode not to make this switch? Or some way for him to understand when I'm writing styles with Styled-Components in ".ts" files and PostCSS in ".css", ".sass" files?

Both enabled: image

Only Styled-components enabled: image

Build environment (please complete the following information):

Additional context image

jasonwilliams commented 2 years ago

Or some way for him to understand when I'm writing styles with Styled-Components in ".ts" files and PostCSS in ".css", ".sass" files?

You should really be using .tsx for any files which have styled component syntax in, this may help you with your conflict. This is mentioned on the readme

.ts is telling VSCode this is a typescript file, .tsx is telling VSCode “this file may have some jsx/tsx syntax in it”

apart from that I can’t really help with PostCSS overriding things, that would be for them to change.