Syntax highlighting breaks if there is a linebreak between "styled" and opening backtick ` #174
Comments
|
I tried replacing every |
|
i'm trying to convert to styled components and this is killlllllling me =x |
|
The issue is this https://github.com/styled-components/vscode-styled-components/blob/master/CONTRIBUTING.md#a-line-break-seems-to-break-the-syntax-highlighting so we know what is causing it now it’s just a case of fixing it. |
* create a multiline fixture from issue styled-components#174 * Fixed by creating two groups, one which was the same as before, and one which adds support for }>` syntax as the beginning. Tests have passed
) The issue with #174 was the main regex, specially the beginning match, which only matches an expression which ends with a back tick. When you use multiline properties your top line no longer ends the same way (`styled.div<{`). This means we need to set a new beginning match. I tried doing this as a new rule but it just didn't work, instead I split the regex into 2 (non-captured) groups and the second group matches: ``` }>` ``` and sets that as the beginning match, so anything after the above will be treated as SCSS, up until the next backtick * [before](https://regex101.com/r/yi6jOv/1/) * [after](https://regex101.com/r/mNfB4E/1/) * Set colorize-fixtures as the folder for extensionHost (debugging) * create a multiline fixture from issue #174 * Fixed by creating two groups, one which was the same as before, and one which adds support for }>` syntax as the beginning. Tests have passed
|
This has been fixed in v1.5.1 please let us know or raise an issue if this is still happening |
|
It looks like there is still a scenario in which the syntax stops working (though I have found it to be greatly improved from other areas (like defining types or attributes).
|
|
Just for fun, here are two other screenshots, where if I pull the FC out into a variable and keep the styled call on a single line, it works -- but if I make it multi line, it stops.
|
See the screenshot, once there is a linebreak between
styledand the opening backtick`CSS syntax highlighting stops working. A normal use case for this would be e.g. declaring an anonymous interface forpropsin Typescript that spans multiple lines.The text was updated successfully, but these errors were encountered: