Formatting incorrect using styled-component component selector pattern #7826
Labels
area:multiparser
Issues with printing one language inside another, like CSS-in-JS
lang:css/scss/less
Issues affecting CSS, Less or SCSS
lang:javascript
Issues affecting JS
locked-due-to-inactivity
Please open a new issue and fill out the template instead of commenting.
type:bug
Issues identifying ugly output, or a defect in the program
Prettier 2.0.1
Playground link
Input:
Output:
Expected behavior:
When using the component selector pattern from styled-components, I am seeing an issue with the formatting of the output CSS. This above is a slightly modified example from the documentation. Note that if I included an
&
to the selector (before the curly brace) it will format correctly (e.g.,${Link}:hover &
).The examples I am seeing in my own application are being formatted:
All of which I would expect to break styling behavior.
Love the new update, though! The Prettier team must have worked incredibly hard to make so many impressive improvements.
Thank you for your time.
The text was updated successfully, but these errors were encountered: