developit / developit/microbundle

Issue Emotion.js, "illegal escape sequence in your template literal"

Aperta
#818 3 commenti 0 reazioni 0 assegnatari Vedi su GitHub
Lingua principale
JavaScript
Stelle
8.1k
Fork
358
Metriche di merge delle PR
Nessuna PR unita negli ultimi 30g

Descrizione

Hi,
I'm having trouble when building components that use Emotion's template literal syntax.

```js
export const Component = styled.div`
background-color: 'blue';

&:hover {
background-color: 'red';
}
`
```

I get the error log:

> You have illegal escape sequence in your template literal, most likely inside content's property value.
Because you write your CSS inside a JavaScript string you actually have to do double escaping, so for example "content: '\00d7';" should become "content: '\\00d7';".

[You can read more about this here](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#ES2018_revision_of_illegal_escape_sequences)

---

Technically, using `@emotion/babel-plugin`, should fix it; [see this thread](https://github.com/emotion-js/emotion/issues/1755)

Nothing seems to work, and I haven't encountered this issue using webpack on other projects.

> My `babel.config.js` does seem to be used by `microbundle`, so I don't know why I have this issue.

Guida per i contributori

Nessuna guida per i contributori indicizzata per questo repository

Valutazione

Questa issue non è ancora stata valutata.

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.