{"library":"rollup-plugin-scss-lit","title":"rollup-plugin-scss-lit","description":"Rollup plugin that imports Sass/SCSS sources as constructable stylesheets for Lit (lit-html/lit-element) and FAST Element projects. Version 2.1.0, released 2024-12-10, supports Node >=18 and peer dependencies lit ^2||^3 and rollup ^2||^3||^4. Replaces rollup-plugin-styles + rollup-plugin-lit-css with a single step. Uses the official Sass compileString API, supports minification via cssnano or esbuild, custom PostCSS transforms, include/exclude patterns, and TypeScript declarations. Faster and simpler than alternative multi-plugin setups.","language":"javascript","status":"active","last_verified":"Mon Apr 27","install":{"commands":["npm install rollup-plugin-scss-lit"],"cli":null},"imports":["import { litScss } from 'rollup-plugin-scss-lit'","declare module '*.scss' { import { CSSResultGroup } from 'lit'; const styles: CSSResultGroup; export default styles; }","import { CSSResultGroup } from 'lit'"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"// rollup.config.js\nimport { litScss } from 'rollup-plugin-scss-lit';\n\nexport default {\n  input: 'src/index.js',\n  output: { file: 'dist/bundle.js', format: 'esm' },\n  plugins: [\n    litScss({\n      include: ['**/*.scss'],\n      exclude: ['node_modules/**'],\n      options: { loadPaths: ['node_modules'] },\n      minify: process.env.NODE_ENV === 'production',\n      plugins: [] // optional PostCSS plugins\n    })\n  ]\n};\n\n// src/my-element.js\nimport { LitElement } from 'lit';\nimport styles from './my-styles.scss';\n\nclass MyElement extends LitElement {\n  static styles = styles;\n  render() {\n    return html`<div>Hello</div>`;\n  }\n}\ncustomElements.define('my-element', MyElement);","lang":"javascript","description":"Shows Rollup config with litScss plugin and a LitElement component importing a SCSS file as static styles.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}