css-minimizer-webpack-plugin

A Webpack plugin that minifies CSS build output via cssnano by default, with swappable csso, clean-css, esbuild, and Lightning CSS backends.

Tool
npm
v8.0.0
326 stars
MIT License

Repository Health

Pre-computed score based on development activity, maintenance, community, maturity, and trend momentum. How we score it →
46 /100 Fair
Development Activity 8
Maintenance 32
Community 64
Maturity 60
Momentum 20

Technical Analysis

AI-assessed by reading the actual repository — architecture, code quality, innovation, and documentation. How we score it →
74 /100 Good
Architecture 78
Code Quality 85
Innovation 78
Learning Curve 55

css-minimizer-webpack-plugin is Webpack’s dedicated CSS asset minifier, wrapping cssnano by default while also supporting csso, clean-css, esbuild, Lightning CSS, and SWC as drop-in minify backends (or a chained array of several). It taps directly into Webpack 5’s optimization.minimizer pipeline: matching assets by test/include/exclude regex, reusing Webpack’s persistent compilation cache to skip re-minifying unchanged output, and distributing work across a jest-worker process pool for parallel builds with full source-map tracing back through PostCSS.

The project’s README currently marks it deprecated in favor of the consolidated minimizer-webpack-plugin (CSS mode), which folds JS and CSS minification into one plugin going forward. It remains widely deployed today (9M+ weekly npm downloads) and still receives maintenance releases (v8.0.0 shipped March 2026) for existing Webpack 5 configurations, but new projects should evaluate the successor plugin before adopting this one.

What You Get

  • Pluggable minifier backends - ship with cssnanoMinify as the default, or switch to cssoMinify, cleanCssMinify, esbuildMinify, or lightningCssMinify via static exports on the plugin class.
  • Asset filtering - test/include/exclude options (regex, string, or array) control exactly which emitted assets get minified.
  • Webpack cache integration - unchanged assets are skipped on rebuild using Webpack’s own persistent compilation.getCache() keyed by content hash.
  • Parallel processing - minification is farmed out across a jest-worker pool sized to available CPU cores, with parallel: true|false|number to tune concurrency.
  • Source map support - respects Webpack’s devtool setting and re-maps warnings/errors back to original file:line:column via @jridgewell/trace-mapping.
  • Chained minifiers - pass an array of minify functions (each with matching minimizerOptions) to run multiple minifiers in sequence over the same asset.

Common Use Cases

  • Production CSS optimization - add new CssMinimizerPlugin() to optimization.minimizer alongside mini-css-extract-plugin to shrink extracted CSS bundles for production builds.
  • Swapping minifier engines - teams that want esbuild’s or Lightning CSS’s faster native minification instead of cssnano’s PostCSS-based pipeline set minify: CssMinimizerPlugin.esbuildMinify.
  • Filtering which stylesheets get minified - large monorepos use include/exclude to minify only certain output directories or skip already-minified vendor CSS.
  • Debugging minifier warnings - warningsFilter lets teams suppress known-noisy cssnano warnings (e.g. from third-party CSS) while still surfacing real issues.

Under The Hood

Architecture

The plugin taps compiler.hooks.compilation and registers on compilation.hooks.processAssets at the PROCESS_ASSETS_STAGE_OPTIMIZE_SIZE stage, filtering candidate assets through Webpack’s ModuleFilenameHelpers.matchObject against the configured test/include/exclude rules. For each unminified asset it consults Webpack’s own persistent cache (compilation.getCache().getItemCache() keyed by a lazily-hashed etag) to skip work on unchanged content, then either dispatches to a jest-worker process pool or runs minify() inline, rebuilding output as RawSource/SourceMapSource instances via Webpack’s sources API. Concurrency is bounded by a small hand-rolled throttleAll task queue rather than an external promise-pool library. Swapping out the core Webpack dependency would require reworking every tap-hook registration, the Compilation.assets/cache calls, and the sources.* construction throughout src/index.js — the plugin has no abstraction layer separating it from Webpack’s internals.

Tech Stack

Written as plain CommonJS with extensive JSDoc @typedef/@template annotations checked via tsc --noEmit, targeting Node >=20.9. Core runtime dependencies are cssnano ^7 (the default minifier), postcss ^8, @jridgewell/trace-mapping for source-map resolution, jest-worker ^30 for the parallel pool, schema-utils ^4 for option validation, and serialize-javascript ^7 to ship functions into worker processes. webpack ^5 is a peer dependency, and clean-css, csso, esbuild, @parcel/css, lightningcss, and @swc/css are all optional peers activated only when selected as the minify implementation. The build pipeline transpiles src/ to dist/ via Babel and generates .d.ts declarations with tsc --declaration --emitDeclarationOnly; tests run under Jest with memfs for in-memory filesystem fixtures.

Code Quality

Thirteen dedicated spec files cover nearly every configuration surface (parallel, minify, minimizerOptions, warningsFilter, sourceMap, cache, include/exclude, test, worker, option validation) plus a core CssMinimizerPlugin.test.js suite, giving thorough regression coverage for a single-purpose plugin. Errors and warnings are wrapped into typed Error objects carrying file/line/column context rather than being swallowed, and schema-utils validates constructor options against a JSON Schema (src/options.json) before any build work runs. The heavy JSDoc typing is enforced in CI-equivalent lint:types, giving near-TypeScript safety without a TypeScript build step; ESLint 9 (flat config), Prettier, cspell, and commitlint/husky/lint-staged round out the toolchain.

API Design The public surface is a single constructor accepting one options object with sensible defaults (cssnano, /\.css(\?.*)?$/i test pattern), and every built-in minifier backend is exposed as a static property on the class itself (CssMinimizerPlugin.esbuildMinify, etc.), so switching implementations needs no extra imports. Passing an array to both minify and minimizerOptions chains multiple minifiers over the same asset with matching per-step options, which is a genuinely useful extension point, though the parallel/array-indexed option pairing does require reading the docs closely to use correctly. Getting started is a two-line addition to optimization.minimizer in an existing Webpack config.

Used by 14 apps in this directory

Go
52%
Apache 2.0

opencloud

File Storage

6,218

Open source file management and collaboration platform that keeps your data under your control, no database required.

View details
86
Repo Health
80
Technical
68
Dependency
Built with
Go 52%
Gherkin 33%
PHP 11%
Updated 1 weeks ago
JavaScript
64%
AGPL 3.0

overleaf

Collaboration · Productivity

18,266

Open-source, real-time collaborative LaTeX editor with sandboxed compilation and full TeXLive support for self-hosted academic and research teams.

View details
84
Repo Health
80
Technical
59
Dependency
Built with
JavaScript 64%
TypeScript 30%
Updated 1 months ago
TypeScript
97%
AGPL 3.0

Responsively App

Design Tools · Developer Tools

25,464

Preview and interact with your responsive web design across every device size simultaneously — no more manual resizing.

View details
79
Repo Health
71
Technical
66
Dependency
Built with
TypeScript 97%
Updated 3 weeks ago
HTML
68%
AGPL 3.0

ToolJet

AI Agents · Low Code Platforms · No Code Platforms

41,123

Open-source AI-native platform to build and deploy internal tools, workflows, and AI agents with a visual drag-and-drop builder and 80+ data source integrations.

View details
94
Repo Health
81
Technical
63
Dependency
Built with
HTML 68%
JavaScript 20%
Updated 6 days ago
Python
57%
Apache 2.0

Zulip

Team Chat

26,102

Topic-based team chat that brings the structure of email threads to real-time messaging, so distributed teams never lose context across hundreds of concurrent conversations.

View details
96
Repo Health
86
Technical
60
Dependency
Built with
Python 57%
TypeScript 19%
JavaScript 11%
Updated 1 weeks ago

Join founders buildingwith open source

Opinionated takes, migration guides, cost-saving tips, and insights from the open source ecosystem.

Subscribe on Substack
Join 750+ subscribers