·tiptap
</>

tiptap

使用 Tiptap 构建富文本编辑器,Tiptap 是一个基于无头 ProseMirror 的编辑器框架,用于支持 Tailwind v4 的 React。涵盖 SSR 安全设置、图像上传、散文样式、协作编辑和 Markdown 支持。在添加富文本编辑器、配置 Tiptap 扩展、在编辑器中处理图像上传或使用 Y.js 设置协作编辑时使用。用于tiptap、富文本、编辑器、prosemirror、react、tailwind。

25安装·2热度·@oakoss

安装

$npx skills add https://github.com/oakoss/agent-skills --skill tiptap

如何安装 tiptap

通过命令行快速安装 tiptap AI 技能到你的开发环境

  1. 打开终端: 打开你的终端或命令行工具(如 Terminal、iTerm、Windows Terminal 等)
  2. 运行安装命令: 复制并运行以下命令:npx skills add https://github.com/oakoss/agent-skills --skill tiptap
  3. 验证安装: 安装完成后,技能将自动配置到你的 AI 编程环境中,可以在 Claude Code、Cursor 或 OpenClaw 中使用

来源:oakoss/agent-skills。

SKILL.md

查看原文

Tiptap is a headless rich text editor built on ProseMirror, providing a modular extension system for React applications. It supports React 19, Tailwind v4, and SSR frameworks like Next.js. Use when building blog editors, comment systems, documentation tools, or Notion-like collaborative apps. Do NOT use with Create React App (CRA is incompatible with Tiptap v3 ESM module structure; use Vite instead).

| Create editor | useEditor({ extensions: [StarterKit], immediatelyRender: false }) | | Render editor | | | Prose styling | Add className="prose dark:prose-invert max-w-none" to container | | Configure StarterKit | StarterKit.configure({ heading: { levels: [1, 2, 3] } }) |

| Disable undo/redo | StarterKit.configure({ undoRedo: false }) (required for Y.js collab) | | Image upload | Set allowBase64: false, use upload handler with URL replacement | | Markdown support | import { Markdown } from '@tiptap/markdown' (official, open-source) |

可引用信息

为搜索与 AI 引用准备的稳定字段与命令。

安装命令
npx skills add https://github.com/oakoss/agent-skills --skill tiptap
分类
</>开发工具
认证
收录时间
2026-02-25
更新时间
2026-03-11

Browse more skills from oakoss/agent-skills

快速解答

什么是 tiptap?

使用 Tiptap 构建富文本编辑器,Tiptap 是一个基于无头 ProseMirror 的编辑器框架,用于支持 Tailwind v4 的 React。涵盖 SSR 安全设置、图像上传、散文样式、协作编辑和 Markdown 支持。在添加富文本编辑器、配置 Tiptap 扩展、在编辑器中处理图像上传或使用 Y.js 设置协作编辑时使用。用于tiptap、富文本、编辑器、prosemirror、react、tailwind。 来源:oakoss/agent-skills。

如何安装 tiptap?

打开你的终端或命令行工具(如 Terminal、iTerm、Windows Terminal 等) 复制并运行以下命令:npx skills add https://github.com/oakoss/agent-skills --skill tiptap 安装完成后,技能将自动配置到你的 AI 编程环境中,可以在 Claude Code、Cursor 或 OpenClaw 中使用

这个 Skill 的源码在哪?

https://github.com/oakoss/agent-skills

详情

分类
</>开发工具
来源
skills.sh
收录时间
2026-02-25