Autoprefixer

Autoprefixer is a PostCSS plugin that removes the need to hand-write vendor-prefixed CSS. It reads your project’s Browserslist configuration (a .browserslistrc file or a browserslist key in package.json), cross-references the target browser list against Can I Use’s compatibility tables via caniuse-lite, and rewrites your stylesheet to add exactly the -webkit-, -moz-, -ms-, and -o- prefixes those browsers still require — nothing more, nothing less.

It ships as a single dependency-free-feeling plugin (require('autoprefixer')) that drops into any PostCSS pipeline — Webpack’s postcss-loader, the postcss-cli, Gulp, Vite, or a plain postcss.config.js — and is recommended by Google and used in production by Twitter and Alibaba.

What You Get

• A PostCSS plugin (autoprefixer()) that adds and removes vendor prefixes automatically based on your configured browser targets
• Browserslist integration, so the same browser-support config drives Autoprefixer, Babel, and other tools consistently
• Dozens of per-feature ‘hack’ modules (flexbox, grid, gradients, backdrop-filter, mask, appearance, and more) that encode each property’s specific prefixing quirks
• A CLI binary (bin/autoprefixer) and a programmatic info() API for inspecting which prefixes would be applied for a given browser list
• Optional limited CSS Grid Layout translation for IE 10/11 via the grid: "autoplace" option or an inline control comment

Common Use Cases

• Dropping into a Webpack, Vite, or postcss-cli build so authored CSS never needs hand-written vendor prefixes
• Sharing one Browserslist target list across Autoprefixer, Babel, and Stylelint for consistent cross-tool browser support
• Auditing legacy CSS with the info() API or CLI to see exactly which prefixes are still needed for a given browser matrix
• Enabling limited CSS Grid autoplacement support for older IE-targeting projects via the grid option

Under The Hood

Architecture — The package’s execution flow starts at lib/autoprefixer.js, which exports a factory function (module.exports = plugin) implementing the PostCSS 8 plugin contract: it returns an object with postcssPlugin: 'autoprefixer' and a prepare(result) hook that resolves a Prefixes instance (from lib/prefixes.js) built against the current Browsers selection (lib/browsers.js, itself wrapping browserslist and caniuse-lite’s unpacked agent data). On OnceExit, it calls prefixes.processor.remove(root, result) then prefixes.processor.add(root, result) (lib/processor.js) to rewrite the PostCSS AST in place. lib/prefixes.js is the orchestration hub — it imports roughly 50 dedicated ‘hack’ modules from lib/hacks/ (e.g. display-flex.js, grid-template.js, backdrop-filter.js, mask-composite.js), each encoding the specific rewrite logic for one CSS feature’s historical vendor-prefixed syntax. Supporting modules (declaration.js, at-rule.js, selector.js, value.js, supports.js, resolution.js, transition.js, vendor.js, brackets.js) handle AST-node-level transforms, and lib/info.js powers the introspection API.

Tech Stack — Runtime dependencies are deliberately narrow: browserslist (target resolution), caniuse-lite (compatibility data, kept current via periodic data/prefixes.js regeneration), fraction.js (precise resolution/media-query math), picocolors (CLI warning output), and postcss-value-parser, with postcss itself as a peer dependency pinned to ^8.1.0. The project builds with pnpm workspaces, lints with oxlint (an oxc-based fast linter, configured via oxlint.config.ts), formats with oxfmt, and targets Node ^10 || ^12 || >=14 for broad compatibility given its position deep in the front-end tooling supply chain.

Code Quality — Testing uses uvu as the runner across 15+ *.test.js files (one per core module: prefixer, prefixes, browsers, declaration, selector, value, supports, at-rule, old-selector, old-value, brackets, utils, info, postcss) plus an extensive test/cases/ directory of paired input/expected-output CSS fixtures covering dozens of individual browser-prefixing scenarios. Coverage is enforced strictly via c8 with check-coverage: true and a lines: 100 threshold — a notably high bar for a library of this size and age. test:lint runs oxlint across the codebase and bin/, and test:size runs size-limit to guard the published bundle against regressions.

API Design — The public surface is a single default export used as require('autoprefixer') or autoprefixer() inside a postcss.config.js plugins array, requiring zero configuration in the common case since it reads Browserslist config automatically from the project. Options (overrideBrowserslist, env, stats, grid, remove, add) are typed via a hand-maintained lib/autoprefixer.d.ts, and the plugin proactively throws clear, actionable errors when deprecated options (browser, browserslist) are used, guiding users to the current overrideBrowserslist name. This makes integration close to one line for the default case while still exposing fine-grained control for advanced setups.