From 418bc1d91cb40d2cc050a4e5b519c12c8cc590c8 Mon Sep 17 00:00:00 2001 From: tobi-or-not-tobi Date: Tue, 3 Aug 2021 14:18:11 +0200 Subject: [PATCH] Improve code sample for lit integration (#991) Align the lit component with the astro import and usage of it. --- packages/renderers/renderer-lit/readme.md | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/packages/renderers/renderer-lit/readme.md b/packages/renderers/renderer-lit/readme.md index 91ae2f390..ed36f9dbd 100644 --- a/packages/renderers/renderer-lit/readme.md +++ b/packages/renderers/renderer-lit/readme.md @@ -36,13 +36,15 @@ __src/components/my-element.js__ ```js import { LitElement, html } from 'lit'; -export const tagName = 'my-counter'; - -class Counter extends LitElement { +export const tagName = 'my-element'; +class MyElement extends LitElement { + render() { + return html`

Hello world! From my-element

`; + } } -customElements.define(tagName, Counter); +customElements.define(tagName, MyElement); ``` > Note that exporting the `tagName` is __required__ if you want to use the tag name in your templates. Otherwise you can export and use the constructor, like with non custom element frameworks.