# postcss-uncss

> Use uncss as a postcss plugin

Latest version **0.17.0** (published 2019-06-29) · MIT license · 0 weekly downloads

## Install

```sh
npm install postcss-uncss
pnpm add postcss-uncss
yarn add postcss-uncss
bun add postcss-uncss
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.17.0 |
| Published | 2019-06-29 |
| First published | 2016-05-27 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 4.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 121 |
| Author | Ryan Zimmerman |
| Maintainers | ryanzim |
| Keywords | postcss-plugin, uncss |

## Links

- npm: https://www.npmjs.com/package/postcss-uncss
- Repository: https://github.com/uncss/postcss-uncss
- Homepage: https://github.com/uncss/postcss-uncss#readme
- Issues: https://github.com/uncss/postcss-uncss/issues
- npm.io page: https://npm.io/package/postcss-uncss

## Recent versions

- 0.17.0 (latest) — 2019-06-29
- 0.16.1 — 2017-11-28
- 0.15.0 — 2017-07-07
- 0.14.0 — 2016-07-09
- 0.0.1 — 2016-05-27

## README

# postcss-uncss
[![npm](https://img.shields.io/npm/v/postcss-uncss.svg?maxAge=2592000)](https://www.npmjs.com/package/postcss-uncss)
[![npm](https://img.shields.io/npm/l/postcss-uncss.svg?maxAge=2592000)](https://github.com/uncss/postcss-uncss/blob/master/LICENSE)

Use [uncss](https://github.com/uncss/uncss) as a [PostCSS](https://github.com/postcss/postcss) plugin.

## About

UnCSS is a tool that removes unused CSS from your stylesheets. It works across multiple files and supports Javascript-injected CSS.

### Example:

**html:**
```html
<body>
  <p class="red">Hello World!</p>
</body>
```

**css before:**
```css
.red {
  color: red;
}
.blue {
  color: blue;
}
```

**css after:**
```css
.red {
  color: red;
}
```

### How?

The HTML files are loaded by [jsdom](https://github.com/tmpvar/jsdom) and JavaScript is executed. UnCSS filters out selectors that are not found in the HTML files.

See the [UnCSS](https://github.com/uncss/uncss) docs for more information.

## Installation

postcss-uncss specifies UnCSS as a [peerDependency](https://docs.npmjs.com/files/package.json#peerdependencies), so you will have to install UnCSS as well.

```bash
npm install postcss-uncss uncss
```

postcss-uncss' MAJOR & MINOR version numbers correspond to UnCSS' version numbers; however, the PATCH version number may differ.

## Usage

```js
postcss([ require('postcss-uncss') ])
```

See [PostCSS](https://github.com/postcss/postcss) docs for examples for your environment.

## Options

- **html** (Array): provide a list of html files to parse for selectors and elements. Usage of [globs](https://github.com/isaacs/node-glob) is allowed.

- **ignore** (Array): provide a list of selectors that should not be removed by UnCSS. For example, styles added by user interaction with the page (hover, click), since those are not detectable by UnCSS yet. Both literal names and regex patterns are recognized. Otherwise, you can add a comment before specific selectors in your css:

  ```css
  /* uncss:ignore */
  .selector1 {
      /* this rule will be ignored */
  }

  .selector2 {
      /* this will NOT be ignored */
  }
  ```

### Example Configuration

```js
{
  html: ['index.html', 'about.html', 'team/*.html'],
  ignore: ['.fade']
}
```

---
_Source: https://npm.io/package/postcss-uncss · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
