Registry / devops / rollup-plugin-postcss

rollup-plugin-postcss

library4.0.2jsnpmunverified

Rollup plugin providing seamless integration with PostCSS. The current stable version is v4.0.2 (released Nov 2021, engines node >=10). It requires PostCSS 8.x as a peer dependency. Key differentiators: supports CSS modules, automatic PostCSS config loading, inject CSS into <head> or extract to file, and works with Sass, Less, Stylus via dependencies. Breaking change in v3: only supports Rollup v2, and extract path must be absolute. v4 upgraded to PostCSS 8. Also provides TypeScript types.

devops web-framework

npm install rollup-plugin-postcss

github ↗package ↗

INSTALL

IMPORT

SIG · ROLLUP-PLUGIN-POST

rollup-plugin-postcss

devopsjavascriptv4.0.2

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–223 runs

build_error

glibc

node 18–223 runs

build_error

Code

Verified usage

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

postcss

✓ import postcss from 'rollup-plugin-postcss'

✗ const postcss = require('rollup-plugin-postcss')

Default export is the plugin factory function. CJS require works in v4 but ESM is recommended.

PostCSSPluginConfig

✓ import type { PostCSSPluginConfig } from 'rollup-plugin-postcss'

Type-only import available since v4.0.0 with shipped TypeScript types.

postcss (CommonJS)

✓ const postcss = require('rollup-plugin-postcss').default

✗ const postcss = require('rollup-plugin-postcss')

In CJS, the default export is under .default. Simple require() without .default returns an object if transpiled incorrectly.

Basic Rollup config using rollup-plugin-postcss with Autoprefixer, CSS modules, extraction, and minimization.

// rollup.config.js import postcss from 'rollup-plugin-postcss'; import autoprefixer from 'autoprefixer'; export default { input: 'src/index.js', output: { dir: 'dist', format: 'esm' }, plugins: [ postcss({ plugins: [autoprefixer()], modules: true, extract: true, minimize: true }) ] };

Debug

Known issues

breakingv3.0 only supports Rollup v2, and extract path must be absolute. Relative paths in extract option will break.

fix

Use absolute paths for extract option, or stay on v2.x if using Rollup 1.x.

affects: >=3.0.0 <4.0.0

breakingv4.0.0 upgrade to PostCSS 8.x. PostCSS 7.x is no longer supported.

fix

Upgrade PostCSS to version 8.x. Update any PostCSS plugins to be compatible with PostCSS 8.

affects: >=4.0.0

deprecatedIn v2, extract: true or a relative path generates file relative to bundle.js. In v3+, extract path should be absolute or resolve via path.resolve.

fix

When upgrading to v3+, change extract option to an absolute path using path.resolve().

affects: >=2.0.0 <3.0.0

gotchaWhen using Sass, this plugin prioritizes dart-sass over node-sass. If both are installed, dart-sass will be used.

fix

Ensure the desired Sass implementation is installed; to use node-sass, uninstall dart-sass.

affects: >=4.0.2

gotchaCSS modules are automatically enabled for `.module.css` files by default (autoModules: true). This may unintentionally process files you expect to be global.

fix

Set autoModules: false to disable automatic CSS modules, or adjust file naming conventions.

affects: >=3.0.0

Errors

Common errors & fixes

Error: The `extract` option must be a boolean or an absolute path.

In v3+, relative paths for extract are not allowed; only absolute or boolean.

fix

Use path.resolve(__dirname, 'dist/styles.css') instead of 'dist/styles.css'.

Error: PostCSS plugin postcss-xxx requires PostCSS 8.

Installed v4 of rollup-plugin-postcss with PostCSS 7.x plugin.

fix

Update PostCSS to 8.x and ensure all PostCSS plugins are compatible.

Cannot find module 'rollup-plugin-postcss'.

Package not installed or missing in node_modules.

fix

Run npm install rollup-plugin-postcss --save-dev.

Error: You must specify a PostCSS plugin.

The plugin options object is empty or plugins array is omitted.

fix

Provide at least one PostCSS plugin in the plugins array, even if empty.

Upgrade

Version history

4.0.2latest on npm

Audit

Dependencies

postcssrequiredpeer dependency (required 8.x)

rolluprequiredrequired as host bundler

Agent activity

4 hits · last 30 days

node

Resources

githubhttps://github.com/egoist/rollup-plugin-postcss ↗

packagehttps://www.npmjs.com/package/rollup-plugin-postcss ↗