Configures Lit to work with its decorators (#4503)

* Configures Lit to work with its decorators

* Remove comment
This commit is contained in:
Matthew Phillips 2022-08-29 14:06:36 -04:00 committed by GitHub
parent feb88afb8c
commit 1222ab9540
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 14 additions and 4 deletions

View file

@ -0,0 +1,5 @@
---
'@astrojs/lit': patch
---
Allow using Lit's decorators

View file

@ -1,8 +1,12 @@
import { LitElement, html } from 'lit'; import { LitElement, html } from 'lit';
import { customElement, property } from 'lit/decorators.js';
@customElement('my-element')
export class MyElement extends LitElement { export class MyElement extends LitElement {
@property({ type: Boolean })
bool = 0;
static properties = { static properties = {
bool: {type: Boolean},
str: {type: String, attribute: 'str-attr'}, str: {type: String, attribute: 'str-attr'},
obj: {type: Object}, obj: {type: Object},
reflectedBool: {type: Boolean, reflect: true}, reflectedBool: {type: Boolean, reflect: true},
@ -36,5 +40,3 @@ export class MyElement extends LitElement {
`; `;
} }
} }
customElements.define('my-element', MyElement);

View file

@ -0,0 +1,3 @@
{
"experimentalDecorators": true
}

View file

@ -13,7 +13,7 @@ function getViteConfiguration() {
exclude: ['@astrojs/lit/server.js'], exclude: ['@astrojs/lit/server.js'],
}, },
ssr: { ssr: {
external: ['lit-element', '@lit-labs/ssr', '@astrojs/lit'], external: ['lit-element', '@lit-labs/ssr', '@astrojs/lit', 'lit/decorators.js'],
}, },
}; };
} }