{"library":"rollup-plugin-lit-css","title":"rollup-plugin-lit-css","description":"Rollup plugin to import CSS files as JavaScript tagged-template literal objects for LitElement, FAST, and other web component libraries. Current version 6.0.1, released August 2024. Includes support for minification via cssnano, custom template tag specifiers, and transform hooks for Sass/Less/PostCSS. Ships TypeScript types. Key differentiator: allows CSS-in-CSS workflow for Lit-based projects, vs alternatives like lit-css-loader (webpack) or esbuild-plugin-lit-css.","language":"javascript","status":"active","last_verified":"Mon Apr 27","install":{"commands":["npm install rollup-plugin-lit-css"],"cli":null},"imports":["import litcss from 'rollup-plugin-lit-css';","import type { RollupPluginLitCssOptions } from 'rollup-plugin-lit-css';","import style from './styles.css';"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"// rollup.config.js\nimport litcss from 'rollup-plugin-lit-css';\n\nexport default {\n  input: 'src/index.js',\n  output: { dir: 'dist', format: 'es' },\n  plugins: [\n    litcss({\n      include: ['**/*.css'],\n      cssnano: true, // minify output\n    }),\n  ],\n};\n\n// src/component.ts\nimport { LitElement, html } from 'lit';\nimport { customElement } from 'lit/decorators.js';\nimport style from './styles.css';\n\n@customElement('my-component')\nclass MyComponent extends LitElement {\n  static styles = [style];\n  render() { return html`<p>Hello World</p>`; }\n}","lang":"typescript","description":"Minimal Rollup config and LitElement component showing CSS import via tagged template literal.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}