Skip to content

postcss-preset-env dynamically skips plugins with importFrom/exportTo based on browser lists #140

@romainmenke

Description

@romainmenke

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

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions