Registry /
web-framework / rollup-plugin-postcss-lit
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
muslnode 18–223 runs
build_error
glibcnode 18–223 runs
build_error
Code
Verified usage
Verified import paths — ran on the pinned version, not inferred.
default (plugin function)
✓ import postcssLit from 'rollup-plugin-postcss-lit'
✗ const postcssLit = require('rollup-plugin-postcss-lit')
ESM default export; CommonJS require is not supported (v2.x+ is ESM-only).
importPackage option
✓ postcssLit({ importPackage: 'lit-element' })
✗ postcssLit({ importPackage: 'lit-element' }) // correct usage; wrong would be omitting it when using lit-element
Defaults to 'lit'. Change to 'lit-element' if your project uses that package.
Vite CSS import with ?inline
✓ import myStyles from './styles.css?inline'
✗ import myStyles from './styles.css'
Without ?inline suffix, Vite will also bundle the CSS separately, causing duplication.
Complete Rollup configuration with postcss and postcss-lit, plus a minimal Lit component importing transformed CSS.
// rollup.config.js
import postcss from 'rollup-plugin-postcss';
import postcssLit from 'rollup-plugin-postcss-lit';
export default {
input: 'src/index.js',
output: { dir: 'dist', format: 'es' },
plugins: [
postcss({ inject: false }), // disable injection for ShadowDOM
postcssLit({ importPackage: 'lit' }),
],
};
// src/my-component.js
import { LitElement, css } from 'lit';
import myStyles from './styles.css';
export class MyComponent extends LitElement {
static styles = myStyles;
render() {
return html`<p>Hello</p>`;
}
}
Errors
Common errors & fixes
Error: The plugin 'postcss-lit' transformed the asset 'styles.css' to a 'css' module but 'css' module type is not supported.
The plugin is not properly registered or is placed before CSS handling plugins.
fixEnsure postcssLit is placed after rollup-plugin-postcss in the plugins array.
SyntaxError: Unexpected token export (or similar when importing the plugin in CommonJS)
The package is ESM-only and cannot be required() in Node.js without ES module support.
fixUse import syntax or set { type: 'module' } in package.json; avoid require(). Module not found: Can't resolve 'lit' (or 'lit-element')
The specified importPackage is not installed as a dependency.
fixInstall the corresponding package: npm install lit or npm install lit-element.
Audit
Dependencies
rollup-plugin-postcssoptionalRequired to process CSS/SCSS/Less files before Lit transformation in Rollup builds