Back to results
ponday-dev/rollup-plugin-lit-sass(opens in a new tab)
Language: JavaScript
- stars
- 3
- watchers
- 0
- forks
- 4
- open issues
- 3
- Last updated
- 08/27/2021
gem-hunterLanguage: JavaScript
Rollup plugin to import '.sass' or '.scss' files as LitElement css templates on JavaScript / TypeScript.
npm install --save-dev @ponday/rollup-plugin-lit-sass
Import and add this plugin to plugins option.
import litSass from '@ponday/rollup-plugin-lit-sass'; export default { entry: 'src/input.js', dest: 'dist/output.js', plugins: [ litSass() ] };
Import sass file on JavaScript.
import { LitElement, html, css} from 'lit-element'; // import as a function that type is (params: { css: typeof require('lit-element').css }) => CSSResult import style from './styles.scss'; export class MyElement extends LitElement { static styles = style({ css }); // other implementations... }
If you want to use TypeScript, you might need type declaraiton file for sass/scss.
An example code for SCSS is following:
declare module "*.scss" { import { css, CSSResult } from 'lit-element'; const scss: (params: { css: typeof css}) => CSSResult; export default scss; }
MIT