Purgecss is a tool to remove unused CSS. It can be used as part of your development workflow. Purgecss comes with a JavaScript API, a CLI, and plugins for popular build tools.

Here are a couple of ways to use Purgecss:


You can install the CLI in two ways. By installing Purgecss globally or using npx.

Install globally

npm i -g purgecss

You can then use it with

purgecss --css <css> --content <content> [option]

Using npx

npx1 allows you to run the CLI locally without installing the package globally.

You can install Purgecss as a dev dependency

npm i -D purgecss

You can then use it with

npx purgecss --css <css> --content <content> [option]

JavaScript API

Start by installing Purgecss as a dev dependency.

npm i -D purgecss

You can then use Purgecss inside a JavaScript file.

ES6 with import

import Purgecss from 'purgecss'
const purgeCss = new Purgecss({
  content: ['**/*.html'],
  css: ['**/*.css']
const purgecssResult = purgecss.purge()

ES5 with require

var Purgecss = require('purgecss')
var purgecss = new Purgecss({
  content: ['**/*.html'],
  css: ['**/*.css']
var purgecssResult = purgecss.purge()


Start by installing the plugin as a dev dependency:

npm i -D purgecss-webpack-plugin
const path = require('path')
const glob = require('glob')
const ExtractTextPlugin = require('extract-text-webpack-plugin')
const PurgecssPlugin = require('purgecss-webpack-plugin')

const PATHS = {
  src: path.join(__dirname, 'src')

module.exports = {
  entry: './src/index.js',
  output: {
    filename: 'bundle.js',
    path: path.join(__dirname, 'dist')
  module: {
    rules: [
        test: /\.css$/,
        use: ExtractTextPlugin.extract({
          fallback: 'style-loader',
          use: 'css-loader?sourceMap'
  plugins: [
    new ExtractTextPlugin('[name].css?[hash]'),
    new PurgecssPlugin({
      paths: glob.sync(`${PATHS.src}/*`)


Start by installing the Gulp plugin as a dev dependency:

npm i -D gulp-purgecss
const gulp = require('gulp')
const purgecss = require('gulp-purgecss')

gulp.task('purgecss', () => {
  return gulp
        content: ['src/**/*.html']


Start by installing the Rollup plugin as a dev dependency:

npm i -D rollup-plugin-purgecss
import { rollup } from 'rollup'
import purgecss from 'rollup-plugin-purgecss'

  entry: 'main.js',
  plugins: [
      content: ['index.html']
1. If you want to use npx, npm 5.2.0+ must be installed.

results matching ""

    No results matching ""