Purgecss: Media queries

[TylerBarnes]

Hi, I'm currently looking for something that will remove duplicate css properties accross media queries. Does this project do that?

for example:

h1 {
    font-size: 25px;
    font-weight: bold;
    color: black;
}

@media screen and (min-width: 1000px) {
   h1 {
    font-size: 30px;
    font-weight: bold;
    color: black;
}
}

I'm hoping the second font weight and color would be discarded.
I'm currently using css purge but it doesn't seem to reliably do this
http://rbtech.github.io/css-purge/

[jsnanigans]

Hi, purgecss does not support this at the moment, but this is a really good idea!
We might implement this feature in the futute

[garygreen]

I would say this is something out the scope of what PurgeCSS is - it's not a minifier.

If you want to remove duplicate rules, your best of looking at cssnano and some plugins.

[jsnanigans]

@garygreen good point but we could add an option to run cssnano after purgecss has completed, this would make implementation of both a lot easier for consumers.

My proposal:
by default it is set to false, you can either pass true for default config or pass the options

const purgeCss = new Purgecss({
  content: ['**/*.html'],
  css: ['**/*.css'],
  cssnano: {
     discardComments: {
        removeAll: true,
     },
   }
})

[garygreen]

PurgeCSS should have nothing to do with cssnano imo. PurgeCSS is for removing unused CSS classes / selectors in your css, that's it. If you want to integrate third party tools then that's easy enough to do already? I don't see why another wrapper / set of options are needed when you can just use tools directly yourself

[Ffloriel]

Purgecss intentionally does not include plugins like cssnano.
Like @garygreen said, the focus is to remove unused css.
Developers might also want to use a different css minifier (clean-css, csso, cssnano).

It does not mean that it's not possible to use them with purgecss. If the need arise to support some plugins, a wrapper could be created separately to ease the implementation when it makes sense.