Skip to content

Unexpected space after two dashes in a template literal #7864

@everdimension

Description

@everdimension

Prettier 2.0.2
Playground link

--parser babel

Input:

const Something = styled.div`
  background: var(--${one}); /* unexpected space after -- */
  border: 1px solid var(--${two}); /* unexpected space after -- */
`;

const What = div`
  background: var(--${one}); /* seems okay */
  border: 1px solid var(--${two}); /* seems okay */
`;

Output:

const Something = styled.div`
  background: var(-- ${one}); /* unexpected space after -- */
  border: 1px solid var(-- ${two}); /* unexpected space after -- */
`;

const What = div`
  background: var(--${one}); /* seems okay */
  border: 1px solid var(--${two}); /* seems okay */
`;

Expected behavior:

There should be no spaces after -- in the first output.
Is there some hardcoded behavior for styled components?

Metadata

Metadata

Assignees

No one assigned

    Labels

    area:multiparserIssues with printing one language inside another, like CSS-in-JSlang:css/scss/lessIssues affecting CSS, Less or SCSSlang:javascriptIssues affecting JSlocked-due-to-inactivityPlease open a new issue and fill out the template instead of commenting.

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions