Registry / devops / postcss-prefix-webpack

postcss-prefix-webpack

library1.0.3jsnpmunverified

A webpack plugin that adds a prefix to all CSS selectors (classes and IDs) in specified files. Version 1.0.3 is the latest and only available release. It is a lightweight plugin with no updates since initial publication. Compared to similar tools like postcss-prefixer, it integrates directly as a webpack plugin rather than a PostCSS plugin, offering ignore patterns for selectors.

devops

npm install postcss-prefix-webpack

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · POSTCSS-PREFIX-WEB

postcss-prefix-webpack

devopsjavascriptv1.0.3

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

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

default

✓ const PostCSSPrefix = require('postcss-prefix-webpack');

✗ import PostCSSPrefix from 'postcss-prefix-webpack';

The package does not export ESM; use CommonJS require. No default export for ES modules.

PostCSSPrefix

✓ new PostCSSPrefix({...})

✗ PostCSSPrefix({...})

It is a constructor, must be used with 'new'.

Shows how to add the plugin to webpack config with input/output files and prefix options.

const PostCSSPrefix = require('postcss-prefix-webpack'); module.exports = { plugins: [ new PostCSSPrefix({ input: './src/style.css', output: './public/style-prefix.css', prefixProperties: { prefix: 'myapp-', ignore: [/^body/, '#keep'] } }) ] };

Debug

Known issues

gotchaPlugin only processes CSS files specified via input; it does not transform CSS imported into JS bundles.

fix

Use PostCSS loader with postcss-prefixer instead if you need to prefix CSS in webpack bundle imports.

affects: >=1.0.0

gotchaIgnore patterns must be either regex or string selectors; strings are matched exactly.

fix

For ignore, use regex for partial matching (e.g., /selector-/) or exact ID/class strings (e.g., '.ignore', '#ignore').

affects: >=1.0.0

Errors

Common errors & fixes

TypeError: PostCSSPrefix is not a constructor

Using the exported function without 'new' keyword.

fix

Use 'new PostCSSPrefix({...})' instead of 'PostCSSPrefix({...})'.

TypeError: Cannot destructure property 'prefix' of 'this.prefixProperties' as it is undefined.

Missing or empty 'prefixProperties' option.

fix

Provide prefixProperties object with 'prefix' and optional 'ignore' fields.

Upgrade

Version history

1.0.3latest on npm

Audit

Dependencies

No dependency data recorded yet.

Agent activity

11 hits · last 30 days

node

Amazon

Resources

githubhttps://github.com/nagendertank/postcss-prefix-webpack ↗

packagepostcss-prefix-webpack ↗

homepagehttps://github.com/nagendertank/postcss-prefix-webpack#readme ↗