WindowsmacOSLinux

Where Does PostCSS Store Its Config?

PostCSS loads config via postcss-load-config from package.json, .postcssrc variants or postcss.config files in the project.

Last updated

PostCSS itself holds no opinions; postcss-load-config finds them. It searches package.json (postcss key), then .postcssrc in escalating extensions, then postcss.config.* files, all from the project root.

JS and TS variants can export functions for env aware plugin lists, while JSON and YAML stay declarative. Whatever shape you pick, the file names the parser, source maps and the plugin chain every build consumes.

Where PostCSS stores this, by platform

Windows
[RepoDir]\postcss.config.js

Parser, map, plugins. Function form receives ctx (env, cwd); object form also accepts plugin paths relative to the config dir.

macOS
[RepoDir]/postcss.config.js

Same discovery. postcss-loader deprecates the object plugin form, so webpack users should prefer the array form in JS configs.

Linux
[RepoDir]/postcss.config.js

Same layout. No config found is a hard error (not silent defaults), which makes a missing file loud instead of mysterious.

Frequently asked questions

My YAML or TypeScript PostCSS config fails to load. Why?

Install yaml (for .yml configs) or tsx/jiti (for .ts configs) as peer deps. The loader errors on missing peers rather than falling back, which looks like a broken config when it is a missing package.

Can one config behave differently per environment?

Export a function from postcss.config.js receiving ctx ({env, cwd}). Branch plugin lists on env (production versus development) without duplicating the file.

Notice an outdated path? Let us know.