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
✓ import litCss from 'vite-plugin-lit-css'
✗ const litCss = require('vite-plugin-lit-css')
ESM-only. CommonJS require will fail.
CSSResult
✓ import styles from './styles.css'
✗ const styles = require('./styles.css')
Imports CSS as a Lit CSSResult object. Must be used in LitElement's static styles property.
TypeScript types
✓ /// <reference types="vite-plugin-lit-css/client" />
✗ /// <reference types="vite/client" /> before vite-plugin-lit-css/client
Type augmentation must be declared before vite/client types for proper CSS module declarations.
Shows how to configure the plugin with Vite and import a CSS file as a Lit stylesheet.
// vite.config.ts
import { defineConfig } from 'vite';
import litCss from 'vite-plugin-lit-css';
export default defineConfig({
plugins: [
litCss({
exclude: ['./src/global.css'],
}),
],
});
// src/my-element.ts
import { LitElement, html } from 'lit';
import styles from './styles.css';
export class MyElement extends LitElement {
static styles = [styles];
render() {
return html`<p>Hello World</p>`;
}
}
declare global {
interface HTMLElementTagNameMap {
'my-element': MyElement;
}
}
customElements.define('my-element', MyElement);
Errors
Common errors & fixes
Cannot find module 'vite-plugin-lit-css' or its corresponding type declarations.
Missing dependency or wrong Node version (<18.2.0).
fixRun 'npm install -D vite-plugin-lit-css' and ensure Node >=18.2.0.
The request url failed: The request url failed with error code 404. Vite is not running.
CommonJS require() used in an ESM-only package.
fixUse 'import litCss from 'vite-plugin-lit-css'' instead of require().
TypeScript: Property 'styles' does not exist on type 'typeof import('./styles.css')'.
Missing or incorrect TypeScript type augmentation.
fixAdd '/// <reference types="vite-plugin-lit-css/client" />' before vite/client in your vite-env.d.ts.
Audit
Dependencies
litrequiredPeer dependency: provides CSSResult and constructible stylesheet APIs
viterequiredPeer dependency: requires Vite's plugin system and CSS processing