# postcss-csso

> PostCSS plugin to minify CSS using CSSO

Latest version **6.0.1** (published 2022-08-11) · MIT license · 0 weekly downloads

## Install

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

## Health

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

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 6.0.1 |
| Published | 2022-08-11 |
| First published | 2016-03-15 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Node | ^12.20.0 \|\| ^14.13.0 \|\| >=15.0.0 |
| Dependencies | 1 |
| Unpacked size | 16.9 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 120 |
| Author | Roman Dvornov |
| Maintainers | lahmatiy |
| Keywords | css, minifier, minify, compress, optimisation, csso, postcss, plugin |

## Links

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

## Dependencies (1)

- [csso](https://npm.io/package/csso.md) ^5.0.5

## Alternatives

- [style-dictionary](https://npm.io/package/style-dictionary.md) — 2.0M weekly downloads
- [postcss-merge-idents](https://npm.io/package/postcss-merge-idents.md) — 1.7M weekly downloads
- [@fontsource/noto-sans](https://npm.io/package/@fontsource/noto-sans.md) — 93.0K weekly downloads
- [uglifycss](https://npm.io/package/uglifycss.md) — 71.6K weekly downloads
- [mat4-interpolate](https://npm.io/package/mat4-interpolate.md) — 23.3K weekly downloads

## Recent versions

- 6.0.1 (latest) — 2022-08-11
- 6.0.0 — 2021-12-15
- 5.0.1 — 2021-04-05
- 5.0.0 — 2020-10-05
- 4.0.0 — 2019-11-02
- 3.0.0 — 2017-10-12
- 2.0.0 — 2017-03-14
- 1.1.2 — 2016-05-08
- 1.1.1 — 2016-04-12
- 1.1.0 — 2016-04-07
- 1.0.1 — 2016-03-20
- 1.0.0 — 2016-03-16
- 0.0.1 — 2016-03-15

## README

[![NPM version](https://img.shields.io/npm/v/postcss-csso.svg)](https://www.npmjs.com/package/postcss-csso)
[![Build Status](https://github.com/lahmatiy/postcss-csso/actions/workflows/build.yml/badge.svg)](https://github.com/lahmatiy/postcss-csso/actions/workflows/build.yml)
[![Coverage Status](https://coveralls.io/repos/github/lahmatiy/postcss-csso/badge.svg?branch=master)](https://coveralls.io/github/lahmatiy/postcss-csso?branch=master)
[![Twitter](https://img.shields.io/badge/Twitter-@cssoptimizer-blue.svg)](https://twitter.com/cssoptimizer)

# postcss-csso

[PostCSS](https://github.com/postcss/postcss) plugin to minify CSS using [CSSO](https://github.com/css/csso) (a CSS minifier with structural optimizations).

Under the hood, the plugin converts `PostCSS` AST into `CSSO`'s AST, optimises it and converts back. The plugin uses `PostCSS`'s input AST nodes (or their clones) on back convertation, so the shape of the original `PostCSS`'s nodes is preserved after the compression in most cases (e.g. properties added by other plugins aren't lost). This approach makes it possible to achieve great performance and correct source maps generation.

The performance of `postcss-csso` is approximately the same as `CSSO` has itself (see `CSSO` numbers in [minifiers comparison table](https://goalsmashers.github.io/css-minification-benchmark/)).

> If you have any difficulties with the output of this plugin, please use the [CSSO tracker](https://github.com/css/csso/issues).

## Install

```
npm install postcss-csso
```

## Usage

```js
import postcss from 'postcss';
import csso from 'postcss-csso';
// CommonJS:
// const csso = require('postcss-csso');

postcss([
    csso
])
    .process('.a { color: #FF0000; } .b { color: rgba(255, 0, 0, 1) }')
    .then((result) => {
        console.log(result.css);
        // .a,.b{color:red}
    });
```

Plugin takes the same [options](https://github.com/css/csso#compressast-options) as `compress()` method of CSSO with no exception.

```js
postcss([
    csso({ restructure: false })
])
    .process('.a { color: #FF0000; } .b { color: rgba(255, 0, 0, 1) }')
    .then((result) => {
        console.log(result.css);
        // .a{color:red}.b{color:red}
    });
```

Using in `postcss.config.js`:

```js
import csso from 'postcss-csso';

export const plugins = [
    csso({
        restructure: false
    })
];
```

## License

MIT

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