developit / developit/microbundle

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

オープン
#818 コメント 3 件 リアクション 0 件 担当者 0 名 GitHub で見る
主要言語
JavaScript
スター
8.1k
フォーク
358
PR マージ指標
30日以内にマージされた PR はありません

説明

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.

コントリビューションガイド

このリポジトリのコントリビューションガイドは索引されていません

評価

この issue はまだ評価されていません。

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。