LogoClawIndex
案例技能关于
LogoClawIndex

tiptap - 使用 Tiptap 构建支持 SSR 的富文本编辑器

使用 React 和 Tailwind v4 构建富文本编辑器,涵盖 SSR 安全配置、扩展、正文样式、图片上传和协作编辑。

标签

更新于: 2026-10-08
tiptap富文本编辑器ReactTailwind CSSSSR图片上传协作编辑

能力

典型输入

典型输出

该技能可以做什么

  • 配置支持 SSR 的编辑器
  • 添加编辑器扩展
  • 设置正文内容样式
  • 处理图片上传
  • 配置协作编辑
  • 排查水合错误

输入

  • React 项目
  • 编辑器内容
  • 图片文件
  • 上传接口
  • 协作设置

输出

  • 编辑器实现代码
  • 渲染的富文本编辑器
  • 带样式的编辑器内容
  • 上传后的图片 URL
  • 故障排查指导

要求

  • React 19 或更高版本
  • Tailwind CSS v4
  • Tiptap 软件包
  • @tiptap/pm 对等依赖
  • npm 安装权限

来源

  • 规范: SKILL.md

ClawIndex

OpenClaw Skills 与 Use Case 索引

ClawIndex 是一个生态驱动的 OpenClaw Skills 与真实 Use Case 索引站。

索引

Skills·
Cases

Meta

关于·
声明·
邮箱·
GitHub
© 2026 ClawIndex 保留所有权利。
配置支持 SSR 的编辑器
添加编辑器扩展
设置正文内容样式
处理图片上传
React 项目
编辑器内容
图片文件
编辑器实现代码
渲染的富文本编辑器
带样式的编辑器内容