fullhuman / purgecss-docs Goto Github PK

Since extract-text-webpack-plugin is deprecated, it would be great to provide an update-to-date example using the recommended mini-css-extract-plugin.

Also, in the readme there is a link to an example, but it leads to a 404.

And what does // do something to collect the whitelist mean?
https://purgecss.com/plugins/webpack.html#options

Thank you!

I'm using the CLI tool via an NPM script, and a configuration file. There's a huge amount of output in the terminal which causes me to lose my place WRT other output. How do I suppress it?

When I search for purgeCSS configuration I get the result https://purgecss.com/configuration which redirects me to https://purgecss.com/configuration.html but displays a 404. If I refresh the page it shows the correct page

Hello,

Is there a way to ignore imported css files. I've tried the following but it doesn't seem to work :(

/*styles.css*/

/* purgecss start ignore */
@import "~react-datepicker/dist/react-datepicker.css";
/* purgecss end ignore */

I feel like the documentation for WordPress could be a little more meatier. I does not mention where these snippets should be added.

If I might add.
I expect it is meant for the the purgecss config file. But what if you are using webpack? Webpack with post css (postcss config) and so on.
This I suspect is general for more of the guides.

I myself is trying to implement purgecss in a webpack config with postcss (postcss config) in a WordPress theme

Hi,
2 Days ago, i just published razzle plugin PurgeCSS, And it's my first ever open source packages. Mind if I add new example to use purgecss with Razzle ?

Thank you.

It would be so much easier if I could whitelist all rules from a file instead of having to specify the rules individually.

My usecase is that I have a prism.css code highlighting theme that defines custom rules for tokens.

Expected outcome

.page .selector-1 { color: blue; }
.page .selector-2 { color: red; }

Reality

.page {
  /* purgecss start ignore */
  .selector-1 { color: blue; }
  .selector-2 { color: red; }
  /* purgecss end ignore */
}

leaves me with:

.page {
  /* purgecss start ignore */
  /* purgecss end ignore */
}

while

/* purgecss start ignore */
.page {
  .selector-1 { color: blue; }
  .selector-2 { color: red; }
}
/* purgecss end ignore */

works as expected.

I guess this is a bug? If not, lets turn this baby into a feature!

Is your feature request related to a problem? Please describe.

pseudo-elements like :before are considered as children e.g selector:
i.flag.us:before

When I wanted whitelist selectors connected with flag icons which are build like one above I
used whitelistPatterns: [/flag/] pattern but it didn't work.

i.flag - selector passed test
i.flag.us:before - selector was purged

I had to use: whitelistPatternsChildren: [/flag/]

Describe the solution you'd like
It would be good if such information would be added in documentation, maybe add an example?