Component not being rendered with Vite + preact-ts template

Offen
  • Stimmt etwas nicht?
#298 7 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Bewertung

Schwierigkeit
3/5
Geschätzter Aufwand
1-2 Tage
Anfängerfreundlichkeit
42/100
Issue-Typ
Bug
Klarheit
Größtenteils klar
Aktivitätsstatus
Veraltet
Tech-Stack
typescript, vite
Bereich
frontend

Rechercherichtung

Beginne mit der Vite-Konfiguration unter Verwendung des preact-Plugins und reproduziere das Problem aus dem preact-ts-Template. Vergleiche die transpilierten Decorator-Ausgaben mit der funktionierenden Version ohne das Plugin; abgeschlossen ist die Aufgabe, wenn das mit @controller dekorierte Custom Element im HTML gerendert wird, während das preact-Plugin aktiviert bleibt.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Beschreibung

Using plugins: [ preact() ] in vite.config.js

Tried to create a basic component, as shown in the guide:

import {controller} from '@github/catalyst';

@controller
class TestThingElement extends HTMLElement {

  connectedCallback() {
    this.innerHTML = 'Hello World!';
  }
}

Then use it from HTML:

<test-thing></test-thing>

Nothing gets rendered on the page, and there's no errors. However, if I don't use the @controller decorator, or if I remove the preact plugin, it does work. I looked at the transpiled code and noticed this:

let TestThingElement = controller(_class = class TestThingElement2 extends HTMLElement {

Any idea what's going on here? I assume this is causing problems with how Catalyst uses the class name to determine the custom element tag.

Vorherrschende Sprache
TypeScript
Sterne
1.4k
Forks
61
Ø Merge
1 T. 15 Std.
Gemergte PRs (30 T.)
8

Entwicklungsumgebung

In Codespaces öffnen

Startet den Dev-Container des Projekts im Browser, mit Ihrem eigenen GitHub-Konto.

Erste Schritte

  1. Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
  3. Forken Sie das Repository und arbeiten Sie in einem Branch.
  4. Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.

Mehr aus github/catalyst

Alle Issues in github/catalyst

Ähnliche Issues

Weitere Issues zu TypeScript

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.