界面描述转代码的Skill

为 json-render 生成框架无关的代码。

codegen 是 json-render 中用于构建代码导出器的 Skill。界面已经用结构化数据描述好,想再输出 Next.js、Remix 等项目文件时,它介绍可用的基础工具。

这些工具遍历界面树,收集组件类型、状态位置和动作名称,再把属性值写成代码格式。比如字符串、数字、布尔值在 JSX 里写法不同,导出器不能只把原始数据直接拼成文本。

生成器最终返回带路径与内容的文件列表,但原文的 Next.js 例子只是骨架,实际生成逻辑留给开发者实现。你需要 json-render 的界面描述、组件对应关系及目标项目规则;它能帮助组织导出过程,不是现成的一键完整网站生成器,输出仍需在目标环境验证。

分类:编程开发

来源仓库:vercel-labs/json-render

适合用来做什么

  • 从 UI 规范生成 React 代码。
  • 构建一个自定义的代码导出器,用于将 JSON 转换为 TypeScript。

安装 codegen

npx skills add https://www.iskills.cc/skills/vercel-labs/json-render/codegen/SKILL.md

在本机终端执行安装命令。安装前请阅读原始说明,确认所需工具、账号和权限。

查看安装步骤 · 查看常见问题

查看 codegen 的用途与原始说明

浏览全部 Skill 指南