Purgecss
  • Introduction
  • Configuration
  • CLI
  • JavaScript API
  • With Webpack
  • With PostCSS
  • With Gulp
  • With Grunt
  • With Rollup
  • Whitelisting
  • Extractors
  • Comparison
  • Guides
    • React
    • Vue
    • Next
    • Nuxt
    • Wordpress
Powered by GitBook
On this page
  • Installation
  • Usage
  • Options
  • content (required)
  • extractors
  • whitelist
  • whitelistPatterns
  • keyframes
  • Contributing
  • Versioning
  • License

With PostCSS

Installation

npm i -D @fullhuman/postcss-purgecss

Usage

In postcss.config.js:

const purgecss = require('@fullhuman/postcss-purgecss')

module.exports = {
  plugins: [
    purgecss({
      content: ['./**/*.html']
    })
  ]
}

Using PostCSS API:

const purgecss = require('@fullhuman/postcss-purgecss')
postcss([
  purgecss({
    content: ['./src/**/*.html']
  })
])

See [PostCSS] docs for examples for your environment.

Options

content (required)

Type: string | Object

You can specify content that should be analyzed by PurgeCSS with an array of filenames or globs. The files can be HTML, Pug, Blade, etc.

extractors

Type: Array<Object>

whitelist

Type: Array<string>

You can whitelist selectors to stop PurgeCSS from removing them from your CSS. This can be accomplished with the options whitelist and whitelistPatterns.

whitelistPatterns

Type: Array<RegExp>

You can whitelist selectors based on a regular expression with whitelistPatterns.

keyframes

Type: boolean Default value: false

If you are using a CSS animation library such as animate.css, you can remove unused keyframes by setting the keyframes option to true.

fontFace

Type: boolean Default value: false

If there are any unused @font-face rules in your css, you can remove them by setting the fontFace option to true.

Contributing

Versioning

License

PreviousWith WebpackNextWith Gulp

Last updated 5 years ago

All of the options of PurgeCSS are available to use with the plugins. You will find below the main options available. For the complete list, go to the .

PurgeCSS can be adapted to suit your needs. If you notice a lot of unused CSS is not being removed, you might want to use a custom extractor. More information about extractors .

Please read for details on our code of conduct, and the process for submitting pull requests to us.

postcss-purgecss use for versioning.

This project is licensed under the MIT License - see the file for details.

PurgeCSS documentation website
here
CONTRIBUTING.md
SemVer
LICENSE