postcss / postcss-simple-vars

PostCSS plugin for Sass-like variables
MIT License
415 stars 36 forks source link

Error when using a variable in the class name #99

Closed senya-g closed 3 years ago

senya-g commented 3 years ago
ERROR in ./components/button/style/index.css (./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./components/button/style/index.css)
Module build failed (from ./node_modules/css-loader/dist/cjs.js):
Error: Invalid class or id selector syntax
   at .../components/button/style/index.css:3:1
ai commented 3 years ago

Can you add console.log to css-loader sources to see that CSS does it received?

Seems like postcss-simple-vars didn’t transform CSS. Maybe PostCSS doesn’t see the config with the plugins list.

sampullman commented 3 years ago

@senya-g Did you mean to write without quotes?

$prefix: foo;

Your version would output .'foo'-button {}, whereas I expect you want .foo-button {}