vercel/satori

Playground support for the object syntax (ie. use without JSX)

Open

#427 建立於 2023年3月12日

在 GitHub 查看
 (2 留言) (1 反應) (0 負責人)TypeScript (13,452 star) (352 fork)user submission
good first issue

描述

Feature Request

Description

Per the readme, Satori supports JSX (with a transpiler enabled), and also a React-like object syntax with type, props.children, and props.style fields. It would be nice if this syntax was usable on the playground as a toggle.

Additional Context

Using Satori without a transpiler, you end up needing to constantly tweak your structure, rerun the script, and re-check the output, in order to iteratively develop and tinker on Satori-made images. When I was previously using Satori with a transpiler, this was easy, thanks to the playground.

貢獻者指南

技術棧
typescriptreact
領域
frontenddeveloper experience
議題類型
feature
難度面向新貢獻者的預計實作難度，1 表示很小改動，5 表示專家級工作。
3
預計時間有經驗貢獻者完成調查、實作、測試並準備 pull request 的粗略時間範圍。
half day
活動狀態議題目前的可參與程度：新鮮、活躍、陳舊、阻塞或等待維護者輸入。
fresh
清晰度議題是否清楚說明預期改動、驗收標準和下一步。
mostly clear
前置要求
Familiarity with ReactUnderstanding of Satori playground codebase
新手友善度1-100 的估計分數，表示該議題對首次貢獻者的友善程度。
60
研究方向
The playground likely has a component for code input/editor. Look at the playground source code in the repository (likely under a 'site' or 'playground' directory). The goal is to add a toggle that switches between JSX (with transpiler) and object syntax. Study how the current playground handles parsing and rendering. Check if any existing UI components (e.g., a dropdown) can be reused. Consider how the object syntax examples are provided in the documentation to inform the implementation.