Skip to content

Docs/rewrite render page#207

Open
VincentZyu233 wants to merge 2 commits intokoishijs:mainfrom
VincentZyu233:docs/rewrite-render-page
Open

Docs/rewrite render page#207
VincentZyu233 wants to merge 2 commits intokoishijs:mainfrom
VincentZyu233:docs/rewrite-render-page

Conversation

@VincentZyu233
Copy link
Copy Markdown
Contributor

@VincentZyu233 VincentZyu233 commented Apr 4, 2026

docs: 重写图片渲染指南(render.md)

图片

概要

整体重写 zh-CN/cookbook/practice/render.md 图片渲染页面,从零构建一份完整的 Koishi 插件图片渲染开发指南。

主要变更

文档结构(全新编写)

章节 内容
渲染方式概述 三种渲染方式(Puppeteer / SVG / Typst)的简介
示例插件 各渲染方式对应的实际插件一览表(含 GitHub/Gitee/Forum 徽章)
Puppeteer 渲染 依赖安装、基本实现、完整示例代码(HTML 模板 + 截图)、优缺点、实际应用截图
SVG 渲染 依赖安装、基本实现、完整示例代码(resvg 渲染流程)、优缺点、实际应用截图
Typst 渲染 依赖安装(含 w-node + to-image-service)、两步流程说明(Typst → SVG → PNG)、完整示例代码、优缺点、实际应用截图
渲染方式对比 三种方式的优缺点和适用场景对比表
最佳实践 选择建议、性能优化、多渲染选项 fallback、错误处理
插件索引 本页所有提到的插件详细列表

新增内容

  • 完整的 Puppeteer / SVG / Typst 三种渲染方式的可运行示例代码
  • 10 张实际插件截图作为示例图片
  • 7 个实际插件的详细介绍,每个都附 GitHub / Gitee / Forum 链接
  • 渲染方式对比表最佳实践章节

参考的实际插件实现

插件 渲染方式 用途
onebot-info-image SVG (resvg) 用户/群信息卡片
music-link-vincentzyu-fork Puppeteer 音乐搜索结果卡片
quote-debug-msg-json-image Typst + Puppeteer JSON/YAML/TOML 数据结构渲染
git-repo-monitor Typst Git 仓库动态通知卡片
twitch Puppeteer Twitch 开播通知
wydashen-guangyi-query Puppeteer 光遇光翼收集查询
anime-convention-lizard-vincentzyu-fork Puppeteer 动漫展信息查询

涉及文件

  • zh-CN/cookbook/practice/render.md — 文档正文(整体重写,+609 行)
  • public/cookbook/practice/*.png — 文档引用的截图资源(10 张)

@VincentZyu233 VincentZyu233 force-pushed the docs/rewrite-render-page branch from c957fef to 3cd0da1 Compare April 4, 2026 18:44
@shigma shigma force-pushed the main branch 5 times, most recently from 8d65e94 to 38a0ae2 Compare April 9, 2026 06:35
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant