2.1.0 • Published 4 years ago

es-dev-server-import-css v2.1.0

Weekly downloads
95
License
ISC
Repository
github
Last release
4 years ago

es-dev-server-import-css

Import CSS Files into your LitElement Components and serve them with es-dev-server

Usage

es-dev-server.config.js

const litcss = require('es-dev-server-import-css');
module.exports = {
  port: 8080,
  watch: true,
  nodeResolve: true,
  appIndex: 'demo/index.html',
  moduleDirs: ['node_modules', 'web_modules'],
  plugins: [
    litcss({
      exclude: ['/src/styles.css'] // linked in html <head>
    })
  ],
};

lit-css.js

import { LitElement, html } from 'lit-element';
import style from './style.css';
export class LitCss extends LitElement {
  static get styles() { return style; }
  render() { return html`<p>😎</p>`; }
}
customElements.define('lit-css', LitCss);

style.css

:host { background: rebeccapurple; }
p { font-style: italic; }

demo/index.html

<script type="module" src="../lit-css.js"></script>
<lit-css></lit-css>