postcss-split-mq
PostCSS plugin to split specific media queries into separate files.
Usage
Assuming a CSS file like this:
/* main.css */ {}
You can split it like this:
const postcss = ;const splitMq = ; const CSS = ; const options = outpath: './' files: name: 'wide.css' match: /min-width:\s*1024px/ ; ;
And that will give you:
/* remaining.css */
and:
/* wide.css */ {}
You can create multiple files
with multiple match
criteria per file. Media queries are captured for a given file if any of its match expressions are found.
e.g.
options = outpath: './' files: name: 'medium.css' match: /min-width:\s*/ /max-width:\s*/ name: 'wide.css' match: /min-width:\s*1024px/ ;
This can be improved. Contributions are welcome. Create an issue if you see a problem or to ask a question.