# vite-plugin-purge

> Enables PurgeCSS for the build

Latest version **1.0.4** (published 2024-11-26) · MIT license · 0 weekly downloads

## Install

```sh
npm install vite-plugin-purge
pnpm add vite-plugin-purge
yarn add vite-plugin-purge
bun add vite-plugin-purge
```

## Health

**Score 55/100 (C)** — status: stable.

Positive: has types; esm support; no vulnerabilities; high maintenance score; high quality score.

Warnings: low downloads.

Negative: stale.

## Facts

| | |
|---|---|
| Version | 1.0.4 |
| Published | 2024-11-26 |
| First published | 2023-07-31 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM |
| Dependencies | 1 |
| Unpacked size | 5.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Beni Arisandi |
| Maintainers | bent10 |
| Keywords | vite, vite-plugin, purgecss, postcss |

## Links

- npm: https://www.npmjs.com/package/vite-plugin-purge
- Repository: https://github.com/bent10/vite-plugins
- Homepage: https://github.com/bent10/vite-plugins/tree/main/packages/plugin-purge
- Issues: https://github.com/bent10/vite-plugins/issues
- npm.io page: https://npm.io/package/vite-plugin-purge

## Dependencies (1)

- [@fullhuman/postcss-purgecss](https://npm.io/package/@fullhuman/postcss-purgecss.md) ^7.0.0

## Alternatives

- [raw-loader](https://npm.io/package/raw-loader.md) — 4.3M weekly downloads
- [plop](https://npm.io/package/plop.md) — 1.4M weekly downloads
- [webpack-deadcode-plugin](https://npm.io/package/webpack-deadcode-plugin.md) — 80.3K weekly downloads
- [@storybook/preact-vite](https://npm.io/package/@storybook/preact-vite.md) — 54.2K weekly downloads
- [vite-plugin-transform](https://npm.io/package/vite-plugin-transform.md) — 2.4K weekly downloads

## Recent versions

- 1.0.4 (latest) — 2024-11-26
- 1.0.3 — 2024-04-06
- 1.0.2 — 2023-08-01
- 1.0.1 — 2023-07-31
- 1.0.0 — 2023-07-31

## README

# Vite Plugin PurgeCSS

A Vite plugin that integrates the [`@fullhuman/postcss-purgecss`][1] package to remove unused CSS during the build process. This plugin helps optimize the size of your CSS files and improve loading times for your Vite applications.

## Install

To use this plugin, you need to have Vite installed in your project. If you haven't set up a Vite project yet, you can do so by following the [Vite documentation][2].

Once you have Vite in your project, you can install the Vite Plugin PurgeCSS using your preferred package manager:

```bash
# With npm
npm i -D vite-plugin-purge

# With yarn
yarn add vite-plugin-purge --dev
```

## Usage

To use the Vite Plugin PurgeCSS in your Vite project, you need to add it to the `plugins` array in your Vite configuration file (`vite.config.js`).

```javascript
// vite.config.js
import pluginPurgeCSS from 'vite-plugin-purge'

export default {
  plugins: [
    pluginPurgeCSS({
      content: ['**/*.html', '**/*.js']
    })
  ]
}
```

## Configuration

The `pluginPurgeCSS` function accepts an options object to configure the behavior of PurgeCSS during the build process. The options are the same as those defined in [`@fullhuman/postcss-purgecss`][1]. For a full list of available options, please refer to the [PurgeCSS documentation][3].

Here's an example of how to use the `safelist` option to prevent certain classes from being purged:

```javascript
// vite.config.js
import pluginPurgeCSS from 'vite-plugin-purge'

export default {
  plugins: [
    pluginPurgeCSS({
      content: ['**/*.html', '**/*.js'],
      safelist: ['bg-red-500', 'text-blue-600']
    })
  ]
}
```

## Additional Notes

- The Vite Plugin PurgeCSS is applied only during the `build` process.
- The plugin is enforced to run after other PostCSS plugins (`enforce: 'post'`) to ensure proper CSS optimization.

## Credits

This plugin is built upon the excellent work of [`@fullhuman/postcss-purgecss`][1], which is the core library responsible for the CSS purging process. Special thanks to the contributors of both `vite-plugin-purge` and [`@fullhuman/postcss-purgecss`][1].

## License

![GitHub](https://img.shields.io/github/license/bent10/vite-plugins)

A project by [Stilearning](https://stilearning.com) © 2022-2023.

[1]: https://github.com/FullHuman/purgecss
[2]: https://vitejs.dev/guide
[3]: https://www.purgecss.com/configuration

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