Component not being rendered with Vite + preact-ts template

未关闭
  • 哪里不对？
#298 7 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看

还没有人认领这个 Issue。

评估

难度
3/5
预计耗时
1-2 天
新手友好度
42/100
Issue 类型
缺陷
描述清晰度
基本清楚
活跃度
停滞
技术栈
typescript, vite
领域
frontend

调研方向

从使用 preact 插件的 Vite 配置开始，并根据 preact-ts 模板复现该问题。将转译后的 decorator 输出与不使用插件的正常版本进行比较；当启用 preact 插件的同时，使用 @controller 装饰的自定义元素能够渲染到 HTML 中时，即表示完成。

由索引模型根据 Issue 内容生成。

描述

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.

主要语言
TypeScript
星标
1.4k
派生
61
平均合并
1 天 15 小时
30 天内合并 PR
8

环境准备

在 Codespaces 中打开

在浏览器里用你自己的 GitHub 账号启动这个项目的开发容器。

  • 没有 Dockerfile 或 Docker Compose 文件
  • 没有 Pull Request 模板
  • 阅读贡献指南

从这里开始

  1. 先读完整个 Issue，再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库，在一个分支上完成修改。
  4. 提交 Pull Request，并在描述里引用这个 Issue 编号。

github/catalyst 的其他 Issue

查看 github/catalyst 的全部 Issue

相似的 Issue

更多 TypeScript Issue

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。