Hacktoberfest 2026: die Issues, die Maintainer für den Oktober markiert haben – offen und einsteigerfreundlich. Hacktoberfest-Issues durchsuchen

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

Offen
#818 3 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Bewertung

Schwierigkeit
4/5
Geschätzter Aufwand
3-5 Tage
Anfängerfreundlichkeit
25/100
Issue-Typ
Bug
Klarheit
Muss geklärt werden
Aktivitätsstatus
Veraltet
Tech-Stack
javascript
Bereich
build-system

Rechercherichtung

Den Build mit dem im Issue gezeigten Emotion-Template-Literal reproduzieren und anschließend babel.config.js sowie die Art untersuchen, wie microbundle die Babel-Konfiguration anwendet. Das resultierende Verhalten mit dem gemeldeten webpack-Verhalten vergleichen. Erledigt ist die Aufgabe, wenn das Beispiel ohne den Fehler wegen einer ungültigen Escape-Sequenz gebaut wird oder die Einschränkung der Konfiguration eindeutig dokumentiert ist.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Beschreibung

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

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

Technically, using @emotion/babel-plugin, should fix it; see this thread

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.

Vorherrschende Sprache
JavaScript
Sterne
8.1k
Forks
358
Keine gemergten PRs in 30 T.

Beitragsleitfaden

Für dieses Repository ist kein Beitragsleitfaden indexiert

Erste Schritte

  1. Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
  3. Forken Sie das Repository und arbeiten Sie in einem Branch.
  4. Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.

Mehr aus developit/microbundle

Alle Issues in developit/microbundle

Ähnliche Issues

Weitere Issues zu JavaScript

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.