Who's using Lit or StencilJS
or Web Components in general??
#tech #coding #programming #lit #stenciljs #webcomponents #frontend
Who's using Lit or StencilJS
or Web Components in general??
#tech #coding #programming #lit #stenciljs #webcomponents #frontend
@khoi I often use `npm init @open-wc`. It’s actively getting some version bumps and upgrades, right now, however, so using it may give you a little friction in the near term.
What sort of build tools are you running into needing? I like that sans TS you can just drop in and leverage Lit right out of the box with any server that resolves bare module specifiers.
If you want to go even leaner, @matsuuu’s got you covered with this great intro to Lit and Import Maps: https://dev.to/matsuuu/buildless-workflow-through-import-maps-featuring-lit-shoelace-and-more-4ill
@khoi @westbrook There is a way to use Lit with no build config.
Use it with JS files, not TS files. Lit is a base class, not a compiler so you can use it at runtime without any build config/step if you are writing JS.
(You can still do type checking via jsdoc)
Example:
```
// @ts-check
import {LitElement, css, html} from 'https://cdn.jsdelivr.net/gh/lit/dist@3/core/lit-core.min.js';
export class SimpleGreeting extends LitElement {
static styles = css`p { color: blue }`;
static properties = {
name: {type: String},
};
constructor() {
super();
this.name = 'Somebody';
}
render() {
return html`<p>Hello, ${this.name}!</p>`;
}
}
customElements.define('simple-greeting', SimpleGreeting);
```