43081j / 43081j/postcss-lit

SyntaxError: Unexpected token

Offen
#29 3 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen
Vorherrschende Sprache
TypeScript
Sterne
90
Forks
9
Ø Merge
1 T. 9 Min.
Gemergte PRs (30 T.)
3

Beschreibung

Hi folks,

## postcss-lit & styled-components ?

I'm looking for the "2022 right way of linting styled components", and `postcss-lit` has been brought in [this discussion](https://github.com/stylelint/postcss-css-in-js/issues/225).

From my understanding:
✅ it **does** grant stylelint the ability to **extract CSS from JS template literals**...
🔴 ... But it does **not** add the **"whole styled components" syntax support**.

Am I right?

## Usage error

I just gave a try to the package with the following stylelint config:
```js
"processors": ["stylelint-processor-styled-components"],
"extends": [
"stylelint-config-standard-scss",
"stylelint-config-styled-components"
],
"customSyntax": "postcss-lit",
```

Which leads me to the following error:

```
$ stylelint "components/**/*.js"
SyntaxError: Unexpected token (1:0)
at instantiate (/Users/username/projectname/node_modules/postcss-lit/node_modules/@babel/parser/lib/index.js:72:32)
at constructor (/Users/username/projectname/node_modules/postcss-lit/node_modules/@babel/parser/lib/index.js:358:12)
at Object.raise (/Users/username/projectname/node_modules/postcss-lit/node_modules/@babel/parser/lib/index.js:3341:19)
at Object.unexpected (/Users/username/projectname/node_modules/postcss-lit/node_modules/@babel/parser/lib/index.js:3379:16)
at Object.parseExprAtom (/Users/username/projectname/node_modules/postcss-lit/node_modules/@babel/parser/lib/index.js:13118:22)
at Object.parseExprSubscripts (/Users/username/projectname/node_modules/postcss-lit/node_modules/@babel/parser/lib/index.js:12643:23)
at Object.parseUpdate (/Users/username/projectname/node_modules/postcss-lit/node_modules/@babel/parser/lib/index.js:12622:21)
at Object.parseMaybeUnary (/Users/username/projectname/node_modules/postcss-lit/node_modules/@babel/parser/lib/index.js:12593:23)
at Object.parseMaybeUnary (/Users/username/projectname/node_modules/postcss-lit/node_modules/@babel/parser/lib/index.js:10795:20)
at Object.parseMaybeUnaryOrPrivate (/Users/username/projectname/node_modules/postcss-lit/node_modules/@babel/parser/lib/index.js:12387:61)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
```

Isn't is supposed to work? 🤔

> as long as you set the syntax, latest postcss should be able to handle it without any extra plugins etc.

Thanks for your work.

---
**Related to:**
https://github.com/43081j/postcss-lit/issues/24

Beitragsleitfaden

Für dieses Repository ist kein Beitragsleitfaden indexiert

Rechercherichtung

The issue is about a SyntaxError when using postcss-lit with stylelint to lint styled components. Start by examining the error stack trace pointing to @babel/parser in the postcss-lit node_modules. Look at the configuration example and compare with the project's README or examples. Check related issue #24 for context. The goal is to understand why the parser fails on the given JS files and whether the config is correct.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
javascript, typescript
Bereich
devtools, tooling
Issue-Typ
Bug
Schwierigkeit
3/5
Geschätzter Aufwand
1-2 Tage
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
45/100

Neue Issues direkt in Ihr Postfach

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