postcss-loader

library8.2.1jsnpmunverified

Webpack loader that processes CSS with PostCSS. Current stable version is 8.2.1, released February 2026, requiring Node.js >=18.12.0 and webpack ^5.0.0. Supports automatic configuration file discovery (postcss.config.js, etc.) and ESM configs via jiti v2. Key differentiator: official webpack integration for PostCSS, handles source maps, CSS-in-JS via execute option, and supports Rspack as optional peer dependency.

devops web-framework

npm install postcss-loader

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · POSTCSS-LOADER

postcss-loader

devopsjavascriptv8.2.1

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

postcss-loader

✓ module.exports = { module: { rules: [ { test: /\.css$/i, use: ['style-loader', 'css-loader', 'postcss-loader'] } ] } }

✗ import postcssLoader from 'postcss-loader'

postcss-loader is a webpack loader, not a JavaScript module. It is configured via webpack config, not imported directly.

Install required dependencies and configure postcss-loader in webpack to process CSS with PostCSS plugins.

npm install --save-dev postcss-loader postcss webpack webpack-cli style-loader css-loader // webpack.config.js module.exports = { module: { rules: [ { test: /\.css$/i, use: [ 'style-loader', 'css-loader', { loader: 'postcss-loader', options: { postcssOptions: { plugins: [ ['postcss-preset-env', { /* options */ }] ] } } } ] } ] } };

Debug

Known issues

breakingNode.js version >=18.12.0 required as of v8.0.0

fix

Upgrade Node.js to 18.12.0 or higher

affects: >=8.0.0

breakingWebpack v5 required for v8.x; v4 users must use postcss-loader v4

fix

Upgrade webpack to v5 or downgrade postcss-loader to v4

affects: >=8.0.0

breakingjiti updated from v1 to v2 in v8.2.0, may break ESM config loading

fix

Ensure jiti v2 is compatible with your config; test ESM load

affects: >=8.2.0

deprecatedOption 'config' is deprecated; use 'postcssOptions' with a config file or inline options

fix

Use 'postcssOptions' field instead of 'config'

affects: >7.x

gotchaIf using CSS-in-JS, you must set 'execute: true' and a PostCSS parser like postcss-js

fix

Add execute: true and postcssOptions.parser: 'postcss-js' in loader options

affects: *

gotchaSource maps may conflict if 'css-loader' sourceMap is disabled

fix

Enable sourceMap in css-loader options and set devtool in webpack config

affects: *

Errors

Common errors & fixes

Module build failed (from ./node_modules/postcss-loader/dist/cjs.js): Error: No PostCSS Config found

PostCSS configuration file (postcss.config.js) is missing or not found

fix

Create a postcss.config.js file at project root or specify plugins via postcssOptions in webpack config

Error: PostCSS plugin postcss-preset-env requires PostCSS 8.

Installed postcss version is 7 but plugin requires PostCSS 8

fix

Install postcss@8: npm install --save-dev postcss@8

TypeError: loaderContext.getOptions is not a function

Using webpack v4 with postcss-loader v7+ (requires webpack v5)

fix

Downgrade to postcss-loader@4 or upgrade webpack to v5

Error: The 'mode' option has not been set, webpack will fallback to 'production' for this value.

Webpack mode not explicitly set; postcss-loader uses mode for config resolution

fix

Set mode in webpack config: module.exports = { mode: 'development', ... }

Upgrade

Version history

8.2.1latest on npm

Audit

Dependencies

postcssrequiredPeer dependency required for processing CSS

webpackrequiredPeer dependency required for loader integration

@rspack/coreoptionalOptional peer dependency for Rspack compatibility

Agent activity

4 hits · last 30 days

node

Resources

githubhttps://github.com/webpack/postcss-loader ↗

packagehttps://www.npmjs.com/package/postcss-loader ↗

homepagehttps://webpack.js.org/loaders/postcss-loader/ ↗