search

hudochenkov / postcss-styled-syntax

PostCSS syntax for CSS-in-JS like styled-components
MIT License
69 stars 4 forks source link

Bug with stylelint --fix #4

Closed lordprotein closed 1 year ago

lordprotein commented 1 year ago

image

I'm trying to use it, but I'm getting an error

Versions: "styled-components": "^5.3.3" "postcss-styled-syntax": "^0.3.1"

image

.stylelintrc

hudochenkov commented 1 year ago

Could you share file content (only minimal content that needs to trigger issue) that trigger this issue?

What is stylelint version? What is your Node.js version?

Could you also share output of these two commands to see what versions are in node_modules?

npm ls postcss
npm ls stylelint
lordprotein commented 1 year ago

Node: v16.16.0 The problem causes absolutely all files with the extension ts, tsx, jsx

│ └── postcss@7.0.39 invalid: "^8.4.21" from node_modules/postcss-styled-syntax
├─┬ postcss-styled-syntax@0.3.1
│ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
├─┬ razzle-plugin-purgecss@1.0.1
│ └─┬ purgecss-webpack-plugin@1.6.0
│   └─┬ purgecss@1.4.2
│     └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
├─┬ razzle@4.2.17
│ ├─┬ autoprefixer@10.4.12
│ │ └── postcss@8.4.17 deduped
│ ├─┬ css-loader@5.2.7
│ │ ├─┬ icss-utils@5.1.0
│ │ │ └── postcss@8.4.17 deduped
│ │ ├─┬ postcss-modules-extract-imports@3.0.0
│ │ │ └── postcss@8.4.17 deduped
│ │ ├─┬ postcss-modules-local-by-default@4.0.0
│ │ │ └── postcss@8.4.17 deduped
│ │ ├─┬ postcss-modules-scope@3.0.0
│ │ │ └── postcss@8.4.17 deduped
│ │ ├─┬ postcss-modules-values@4.0.0
│ │ │ └── postcss@8.4.17 deduped
│ │ └── postcss@8.4.17
│ ├─┬ css-minimizer-webpack-plugin@1.3.0
│ │ └─┬ cssnano@4.1.11
│ │   ├─┬ cssnano-preset-default@4.0.8
│ │   │ ├─┬ css-declaration-sorter@4.0.1
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ cssnano-util-raw-cache@4.0.1
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-calc@7.0.5
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-colormin@4.0.3
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-convert-values@4.0.1
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-discard-comments@4.0.2
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-discard-duplicates@4.0.2
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-discard-empty@4.0.1
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-discard-overridden@4.0.1
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-merge-longhand@4.0.11
│ │   │ │ ├── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ │ └─┬ stylehacks@4.0.3
│ │   │ │   └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-merge-rules@4.0.3
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-minify-font-values@4.0.2
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-minify-gradients@4.0.2
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-minify-params@4.0.2
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-minify-selectors@4.0.2
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-normalize-charset@4.0.1
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-normalize-display-values@4.0.2
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-normalize-positions@4.0.2
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-normalize-repeat-style@4.0.2
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-normalize-string@4.0.2
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-normalize-timing-functions@4.0.2
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-normalize-unicode@4.0.1
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-normalize-url@4.0.1
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-normalize-whitespace@4.0.2
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-ordered-values@4.1.2
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-reduce-initial@4.0.3
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-reduce-transforms@4.0.2
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-svgo@4.0.3
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ ├─┬ postcss-unique-selectors@4.0.1
│ │   │ │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   │ └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ │   └── postcss@7.0.39 deduped invalid: "^8.4.21" from node_modules/postcss-styled-syntax
│ ├─┬ postcss-load-config@3.1.4
│ │ └── postcss@8.4.17 deduped
│ ├─┬ postcss-loader@4.3.0
│ │ └── postcss@8.4.17 deduped
│ └── postcss@8.4.17
└─┬ stylelint@14.16.1
  ├─┬ @csstools/selector-specificity@2.0.2
  │ └── postcss@8.4.21 deduped
  ├─┬ postcss-safe-parser@6.0.0
  │ └── postcss@8.4.21 deduped
  └── postcss@8.4.21

npm ERR! code ELSPROBLEMS
npm ERR! invalid: postcss@7.0.39 
├─┬ stylelint-config-recommended@9.0.0
│ └── stylelint@14.16.1 deduped
└── stylelint@14.16.1
hudochenkov commented 1 year ago

I see that there are different PostCSS versions in your tools. And for some reason wrong PostCSS version (7.0.39) is forced to be used with postcss-styled-syntax. While Stylelint has newer version 8.4.21.

This is not a problem with Stylelint or postcss-styled-syntax. But with your specific install.

To fix your install this might help.

  1. Uninstall @stylelint/postcss-css-in-js.

  2. Uninstall and install again packages, that use PostCSS:

postcss-styled-syntax
razzle-plugin-purgecss
razzle
stylelint
  1. Check with npm ls postcss that there are no deduped invalid messages and no errors at the end. All PostCSS versions should be 8.4.21.
lordprotein commented 1 year ago

Some packages of Razzle (css-minimizer-webpack-plugin@1.3.0) are still installed with postcss@7.0.39 and have not been updated to the latest( I updated package css-minimizer-webpack-plugin to v4.2.2 manually, but the error did not disappear


│ └── postcss@8.4.21 deduped
├─┬ css-loader@5.2.7
│ ├─┬ icss-utils@5.1.0
│ │ └── postcss@8.4.21 deduped
│ ├─┬ postcss-modules-extract-imports@3.0.0
│ │ └── postcss@8.4.21 deduped
│ ├─┬ postcss-modules-local-by-default@4.0.0
│ │ └── postcss@8.4.21 deduped
│ ├─┬ postcss-modules-scope@3.0.0
│ │ └── postcss@8.4.21 deduped
│ ├─┬ postcss-modules-values@4.0.0
│ │ └── postcss@8.4.21 deduped
│ └── postcss@8.4.21 deduped
├─┬ css-minimizer-webpack-plugin@4.2.2
│ ├─┬ cssnano@5.1.14
│ │ ├─┬ cssnano-preset-default@5.2.13
│ │ │ ├─┬ css-declaration-sorter@6.3.1
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ cssnano-utils@3.1.0
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-calc@8.2.4
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-colormin@5.3.0
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-convert-values@5.1.3
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-discard-comments@5.1.2
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-discard-duplicates@5.1.0
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-discard-empty@5.1.1
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-discard-overridden@5.1.0
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-merge-longhand@5.1.7
│ │ │ │ ├── postcss@8.4.21 deduped
│ │ │ │ └─┬ stylehacks@5.1.1
│ │ │ │   └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-merge-rules@5.1.3
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-minify-font-values@5.1.0
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-minify-gradients@5.1.1
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-minify-params@5.1.4
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-minify-selectors@5.2.1
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-normalize-charset@5.1.0
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-normalize-display-values@5.1.0
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-normalize-positions@5.1.1
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-normalize-repeat-style@5.1.1
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-normalize-string@5.1.0
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-normalize-timing-functions@5.1.0
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-normalize-unicode@5.1.1
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-normalize-url@5.1.0
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-normalize-whitespace@5.1.1
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-ordered-values@5.1.3
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-reduce-initial@5.1.1
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-reduce-transforms@5.1.0
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-svgo@5.1.0
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ ├─┬ postcss-unique-selectors@5.1.1
│ │ │ │ └── postcss@8.4.21 deduped
│ │ │ └── postcss@8.4.21 deduped
│ │ └── postcss@8.4.21 deduped
│ └── postcss@8.4.21 deduped
├─┬ postcss-load-config@3.1.4
│ └── postcss@8.4.21 deduped
├─┬ postcss-loader@4.3.0
│ └── postcss@8.4.21 deduped
└── postcss@8.4.21```
hudochenkov commented 1 year ago

I don't see Stylelint or postcss-styled-syntax in this output.

When I try to install these packages:

npm i postcss-styled-syntax razzle-plugin-purgecss razzle stylelint

PostCSS version is correct for Stylelint and postcss-styled-syntax:

├─┬ postcss-styled-syntax@0.3.1
│ └── postcss@8.4.21
├─┬ razzle-plugin-purgecss@1.0.1
│ └─┬ purgecss-webpack-plugin@1.6.0
│   └─┬ purgecss@1.4.2
│     └── postcss@7.0.39
├─┬ razzle@4.2.18
│ ├─┬ autoprefixer@10.4.13
│ │ └── postcss@8.4.21 deduped
│ ├─┬ css-loader@5.2.7
│ │ ├─┬ icss-utils@5.1.0
│ │ │ └── postcss@8.4.21 deduped
│ │ ├─┬ postcss-modules-extract-imports@3.0.0
│ │ │ └── postcss@8.4.21 deduped
│ │ ├─┬ postcss-modules-local-by-default@4.0.0
│ │ │ └── postcss@8.4.21 deduped
│ │ ├─┬ postcss-modules-scope@3.0.0
│ │ │ └── postcss@8.4.21 deduped
│ │ ├─┬ postcss-modules-values@4.0.0
│ │ │ └── postcss@8.4.21 deduped
│ │ └── postcss@8.4.21 deduped
│ ├─┬ css-minimizer-webpack-plugin@1.3.0
│ │ └─┬ cssnano@4.1.11
│ │   ├─┬ cssnano-preset-default@4.0.8
│ │   │ ├─┬ css-declaration-sorter@4.0.1
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ cssnano-util-raw-cache@4.0.1
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-calc@7.0.5
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-colormin@4.0.3
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-convert-values@4.0.1
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-discard-comments@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-discard-duplicates@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-discard-empty@4.0.1
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-discard-overridden@4.0.1
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-merge-longhand@4.0.11
│ │   │ │ ├── postcss@7.0.39
│ │   │ │ └─┬ stylehacks@4.0.3
│ │   │ │   └── postcss@7.0.39
│ │   │ ├─┬ postcss-merge-rules@4.0.3
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-minify-font-values@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-minify-gradients@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-minify-params@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-minify-selectors@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-normalize-charset@4.0.1
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-normalize-display-values@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-normalize-positions@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-normalize-repeat-style@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-normalize-string@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-normalize-timing-functions@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-normalize-unicode@4.0.1
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-normalize-url@4.0.1
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-normalize-whitespace@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-ordered-values@4.1.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-reduce-initial@4.0.3
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-reduce-transforms@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-svgo@4.0.3
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-unique-selectors@4.0.1
│ │   │ │ └── postcss@7.0.39
│ │   │ └── postcss@7.0.39
│ │   └── postcss@7.0.39
│ ├─┬ postcss-load-config@3.1.4
│ │ └── postcss@8.4.21 deduped
│ ├─┬ postcss-loader@4.3.0
│ │ └── postcss@8.4.21 deduped
│ └── postcss@8.4.21 deduped
└─┬ stylelint@14.16.1
  ├─┬ @csstools/selector-specificity@2.0.2
  │ └── postcss@8.4.21 deduped
  ├─┬ postcss-safe-parser@6.0.0
  │ └── postcss@8.4.21 deduped
  └── postcss@8.4.21 deduped

P. S. Use three backticks, instead one when posting output. Then Github shows it correctly.


```
```
lordprotein commented 1 year ago

Found a problem related to different versions. The fact is that the postcss itself was not installed Now I don't have version conflicts and I get this error and I still can't figure out why

image 
├─┬ postcss-jsx@0.36.4
│ └── postcss@8.4.21 deduped
├─┬ postcss-styled-syntax@0.3.1
│ └── postcss@8.4.21 deduped
├─┬ postcss-syntax@0.36.2
│ └── postcss@8.4.21 deduped
├── postcss@8.4.21
├─┬ razzle-plugin-purgecss@1.0.1
│ └─┬ purgecss-webpack-plugin@1.6.0
│   └─┬ purgecss@1.4.2
│     └── postcss@7.0.39
├─┬ razzle@4.2.18
│ ├─┬ autoprefixer@10.4.13
│ │ └── postcss@8.4.21 deduped
│ ├─┬ css-loader@5.2.7
│ │ ├─┬ icss-utils@5.1.0
│ │ │ └── postcss@8.4.21 deduped
│ │ ├─┬ postcss-modules-extract-imports@3.0.0
│ │ │ └── postcss@8.4.21 deduped
│ │ ├─┬ postcss-modules-local-by-default@4.0.0
│ │ │ └── postcss@8.4.21 deduped
│ │ ├─┬ postcss-modules-scope@3.0.0
│ │ │ └── postcss@8.4.21 deduped
│ │ ├─┬ postcss-modules-values@4.0.0
│ │ │ └── postcss@8.4.21 deduped
│ │ └── postcss@8.4.21 deduped
│ ├─┬ css-minimizer-webpack-plugin@1.3.0
│ │ └─┬ cssnano@4.1.11
│ │   ├─┬ cssnano-preset-default@4.0.8
│ │   │ ├─┬ css-declaration-sorter@4.0.1
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ cssnano-util-raw-cache@4.0.1
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-calc@7.0.5
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-colormin@4.0.3
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-convert-values@4.0.1
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-discard-comments@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-discard-duplicates@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-discard-empty@4.0.1
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-discard-overridden@4.0.1
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-merge-longhand@4.0.11
│ │   │ │ ├── postcss@7.0.39
│ │   │ │ └─┬ stylehacks@4.0.3
│ │   │ │   └── postcss@7.0.39
│ │   │ ├─┬ postcss-merge-rules@4.0.3
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-minify-font-values@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-minify-gradients@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-minify-params@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-minify-selectors@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-normalize-charset@4.0.1
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-normalize-display-values@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-normalize-positions@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-normalize-repeat-style@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-normalize-string@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-normalize-timing-functions@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-normalize-unicode@4.0.1
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-normalize-url@4.0.1
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-normalize-whitespace@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-ordered-values@4.1.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-reduce-initial@4.0.3
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-reduce-transforms@4.0.2
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-svgo@4.0.3
│ │   │ │ └── postcss@7.0.39
│ │   │ ├─┬ postcss-unique-selectors@4.0.1
│ │   │ │ └── postcss@7.0.39
│ │   │ └── postcss@7.0.39
│ │   └── postcss@7.0.39
│ ├─┬ postcss-load-config@3.1.4
│ │ └── postcss@8.4.21 deduped
│ ├─┬ postcss-loader@4.3.0
│ │ └── postcss@8.4.21 deduped
│ └── postcss@8.4.21 deduped
├─┬ stylelint-processor-styled-components@1.10.0
│ └── postcss@7.0.39
└─┬ stylelint@14.16.1
  ├─┬ @csstools/selector-specificity@2.0.2
  │ └── postcss@8.4.21 deduped
  ├─┬ postcss-safe-parser@6.0.0
  │ └── postcss@8.4.21 deduped
  └── postcss@8.4.21 deduped

├─┬ stylelint-config-recommended@7.0.0
│ └── stylelint@14.16.1 deduped
└── stylelint@14.16.1
hudochenkov commented 1 year ago

What is the content of a file that it can't parse? Could you find what part of it causes an issue and share?

lordprotein commented 1 year ago

Sure The error occurs absolutely in all files that contain Styled As template:

image
hudochenkov commented 1 year ago

Could you create a repository with reproduced error? I can't understand what is happening. Everything seems in order. Make sure to include tsconfig.json if you have it in the repository as it might or might not have an impact.

qeleb commented 1 year ago

+1 having this same issue

hudochenkov commented 1 year ago

@qeleb Could you create a repository with reproduced error?

qeleb commented 1 year ago

@hudochenkov Hi! No worries. I’ve sorted out my problem somehow over the past hour and a half of troubleshooting. I was switching between your postcss-styled-syntax and postcss-lit and actually having the same issue with both. Ultimately I fixed it somehow and landed on a working solution with postcss-lit.

After all of that trouble, I can finally use your css property ordering— I love it. Thanks for making it and for the quick reply :)

hudochenkov commented 1 year ago

Closing as there is no follow up.