Open romainmenke opened 8 months ago
Thanks @romainmenke
Small PostCSS plugin to fix the problem as a temporary solution:
module.exports = {
postcssPlugin: 'svelte-nesting-css-fixer',
Rule(rule) {
delete rule.raws.ownSemicolon
}
}
Small PostCSS plugin to fix the problem as a temporary solution:
What a perfect timing! I can live up with this until it gets merged. Thanks!
// postcss.config.cjs
const nested = require('postcss-nested');
const svelteNestingCssFixer = {
postcssPlugin: 'svelte-nesting-css-fixer',
Rule(rule) {
delete rule.raws.ownSemicolon
}
};
const config = {
plugins: [
nested,
svelteNestingCssFixer,
],
};
module.exports = config;
Describe the bug
re-post of : https://github.com/csstools/postcss-plugins/issues/1150
I am submitting this bug report after it was filed in
postcss-nesting
by @AlbertMarashi. I am a maintainer ofpostcss-nesting
, I am not the author of the reproduction. I do not use Svelte, Vite, CSS modules, ... so I don't really know much about the repro or what the current best practices are in Svelte for CSS.What I did :
@csstools/postcss-debug-logger
npm run build
This logs :
For a regular rule
"ownSemicolon":";"
should not be present. This is not added bypostcss-nesting
.Because I don't know anything about Svelte I am also unsure which parts might be responsible.
I know that currently there isn't really support for CSS Nesting in Svelte. So maybe good to test for this case when support is rolled out.
https://github.com/sveltejs/svelte/issues/8587
Bug description
Semicolons being added after
}
blocks using css nesting, leading to invalid CSS (semicolons not valid after}
block)Source CSS
Expected CSS
Actual CSS
Reproduction
https://github.com/AlbertMarashi/postcss-nesting-bug
Logs
System Info
Severity
not even an annoyance