-
- Notifications
You must be signed in to change notification settings - Fork 83
Closed
Labels
Description
Bug description
preset-env is a way to dynamically toggle plugins on and off based on config.
This conflicts with importFrom/exportTo and maybe other options where it is always required to run a certain plugin.
I don't see a way for these kinds of options to ever work correctly with postcss-preset-env.
Source CSS
.test-custom-properties { order: var(--order); } @media (--narrow-window) { .test-custom-media-queries { order: 2; } } .test-custom-selectors { &:--heading { order: 3; } }Expected CSS
:root { --order: 1; } .test-custom-properties { order: var(--order); } @media (max-width: 40rem) { .test-custom-media-queries { order: 2; } } h1.test-custom-selectors,h2.test-custom-selectors,h3.test-custom-selectors,h4.test-custom-selectors,h5.test-custom-selectors,h6.test-custom-selectors { order: 3; } Actual CSS
.test-custom-properties { order: var(--order); } @media (max-width: 40rem) { .test-custom-media-queries { order: 2; } } h1.test-custom-selectors,h2.test-custom-selectors,h3.test-custom-selectors,h4.test-custom-selectors,h5.test-custom-selectors,h6.test-custom-selectors { order: 3; } Does it happen with npx @csstools/csstools-cli <plugin-name> minimal-example.css?
No response
Extra config
options: { browsers: 'chrome >= 88', importFrom: { customMedia: { '--narrow-window': '(max-width: env(--sm))' }, customProperties: { '--order': '1' }, customSelectors: { ':--heading': 'h1, h2, h3, h4, h5, h6' }, environmentVariables: { '--sm': '40rem' } }, stage: 0 }What plugin are you experiencing this issue on?
PostCSS Preset Env, PostCSS Custom Properties
Plugin version
latest
What OS are you experiencing this on?
No response
Node Version
latest
Validations
- Follow our Code of Conduct
- Check that there isn't already an issue that request the same feature to avoid creating a duplicate.
Would you like to open a PR for this bug?
- I'm willing to open a PR
SRFeesha