Closed ammediagmbh closed 2 months ago
Hi @ammediagmbh,
Please read the documentation :)
https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-nesting#postcss-nesting-
If you want nested rules the same way Sass works you might want to use PostCSS Nested instead.
@ammediagmbh Did that answer your question?
I see this issue was closed and re-opened and another duplicate issue was filed by someone else, what is going on?
Hi romainmenke
Sorry, it was wrong for my side. It's fine. Thanks for the answer. I apparently confused sass using concatenation and nesting using selectors. Sorry for that
That's fine, always happy to help 🙇
Bug description
Using the "&" selector in nested code works until it's used with underscores "&_", "&" or used with dashes "&-", "&--" . In that cases the symbol is right replaced but added at the end of the class rule.
Source CSS
Expected CSS
Actual CSS
Playgound example
https://preset-env.cssdb.org/playground/#JTdCJTIyc291cmNlJTIyJTNBJTIyLmxheW91dC1idWlsZGVyJTIwJTdCJTVDbiUyMCUyMHBhZGRpbmclM0ElMjAxLjVlbSUyMDEuNWVtJTIwMC41ZW0lM0IlNUNuJTIwJTIwYm9yZGVyJTNBJTIwM3B4JTIwc29saWQlMjAlMjMyZjkxZGElM0IlNUNuJTIwJTIwYmFja2dyb3VuZC1jb2xvciUzQSUyMCUyM2ZmZiUzQiU1Q24lMjAlMjAlNUNuJTIwJTIwJTI2X19hZGQtc2VjdGlvbiUyMCU3QiU1Q24lMjAlMjAlMjB3aWR0aCUzQSUyMDEwMCUyNSUzQiU1Q24lMjAlMjAlMjBtYXJnaW4tYm90dG9tJTNBJTIwMS41ZW0lM0IlNUNuJTIwJTIwJTIwYWRkaW5nJTNBJTIwMS41ZW0lMjAwJTNCJTVDbiUyMCUyMCUyMHRleHQtYWxpZ24lM0ElMjBjZW50ZXIlM0IlNUNuJTIwJTIwJTIwb3V0bGluZSUzQSUyMDJweCUyMGRhc2hlZCUyMCUyMzk3OTc5NyUzQiU1Q24lMjAlMjAlMjBiYWNrZ3JvdW5kLWNvbG9yJTNBJTIwJTIzZjdmN2Y3JTNCJTVDbiUyMCUyMCU3RCU1Q24lN0QlMjIlMkMlMjJjb25maWclMjIlM0ElN0IlMjJicm93c2VycyUyMiUzQSU1QiUyMiUzRSUyMDAuMiUyNSUyMGFuZCUyMG5vdCUyMGRlYWQlMjIlNUQlMkMlMjJtaW5pbXVtVmVuZG9ySW1wbGVtZW50YXRpb25zJTIyJTNBMCUyQyUyMnN0YWdlJTIyJTNBMiUyQyUyMmxvZ2ljYWwlMjIlM0ElN0IlMjJpbmxpbmVEaXJlY3Rpb24lMjIlM0ElMjJsZWZ0LXRvLXJpZ2h0JTIyJTJDJTIyYmxvY2tEaXJlY3Rpb24lMjIlM0ElMjJ0b3AtdG8tYm90dG9tJTIyJTdEJTJDJTIyZmVhdHVyZXMlMjIlM0ElN0IlMjJuZXN0aW5nLXJ1bGVzJTIyJTNBJTVCJTIyYXV0byUyMiUyQyU3QiUyMmVkaXRpb24lMjIlM0ElMjIyMDI0LTAyJTIyJTdEJTVEJTdEJTJDJTIycHJlc2VydmUlMjIlM0F0cnVlJTdEJTdE
Does it happen with
npx @csstools/csstools-cli <plugin-name> minimal-example.css
?N/A
Debug output
I couldn't get any output using the debug option. However I can put here, how the postcss().process() is called:
/ compile.js / const log = require('./log'); const fs = require('fs'); const postcss = require('postcss'); const postcssImport = require('postcss-import'); const postcssHeader = require('postcss-header'); const postcssUrl = require('postcss-url'); const postcssPresetEnv = require('postcss-preset-env'); // cspell:ignore pxtorem const postcssPixelsToRem = require('postcss-pxtorem'); const prettier = require('prettier'); const removeUnwantedComments = require('./remove-unwanted-comments');
module.exports = (filePath, callback) => { // Transform the file. fs.readFile(filePath, (err, css) => {
}); };
Extra config
What plugin are you experiencing this issue on?
PostCSS Preset Env
Plugin version
9.6.0
What OS are you experiencing this on?
macOS
Node Version
18.20.4 and 20.15.1
Validations
Would you like to open a PR for this bug?