tiptap
一个无头、可扩展的富文本编辑器框架
安装使用
复制下面这段提示词发给你的 AI（Claude / Cursor / TRAE / Codex / WorkBuddy 等），它会自动帮你完成安装：
帮我安装这个 AI Skill：tiptap。 它的用途是：一个无头、可扩展的富文本编辑器框架 完整的 Skill 内容见：https://321skill.com/skills/tiptap/raw/index.md 请读取该页面内容，如果是 SKILL.md 格式直接安装，如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接，AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
“我正在用 Vue 3 开发一个博客后台，需要一个支持 Markdown 快捷输入和图片上传的富文本编辑器，请帮我用 Tiptap 配置一个基础版本。”，它会指导你安装 @tiptap/vue-3, @tiptap/starter-kit 等核心包，并提供一个包含基础格式（标题、粗体、列表）和图片扩展的初始化代码示例，让你快速集成到组件中。
介绍
Tiptap 是一个专为现代 Web 应用设计的无头（Headless）富文本编辑器框架。它主要解决了开发者在构建定制化、功能丰富的文本编辑体验时，受限于传统编辑器固定 UI 和功能捆绑的难题。通过提供一套完全解耦的、基于扩展的核心，Tiptap 让开发者能够自由选择和组合功能模块，从而构建出从简单评论框到复杂文档协作平台的各种编辑器。
使用 Tiptap 时，开发者首先安装核心包，然后根据项目需求引入所需的扩展（如加粗、列表、表格、代码块等），最后在自己的 Vue、React 或纯 JavaScript 项目中初始化编辑器实例，并将其渲染到自定义的 UI 组件中。其 API 设计直观，文档详尽，便于集成和二次开发。
这个工具非常适合前端开发者、全栈工程师以及需要为产品（如 CMS、知识库、在线文档工具、论坛等）嵌入高度定制化编辑功能的团队。它尤其受到那些对用户体验和界面设计有严格要求，且不希望被预设样式束缚的开发者青睐。
与同类工具（如 Quill、Draft.js、Slate）相比，Tiptap 的核心优势在于其“无头”架构和强大的扩展生态系统。它不提供任何预设的 UI 样式，将视觉控制权完全交给开发者，同时其底层基于稳定可靠的 ProseMirror，确保了强大的文档模型和操作能力。此外，它与 Yjs 和 Hocuspocus 的深度集成，使其在实时协作编辑领域表现出色。
核心特点
Tiptap 采用彻底的无头（Headless）架构，不捆绑任何 UI 样式，赋予开发者 100% 的界面设计自由；同时，它基于工业级的 ProseMirror 构建，并拥有超过 100 个官方与社区扩展，在功能定制性和协作编辑支持上尤为突出。
注意事项
对于只需要一个开箱即用、无需任何样式定制或功能扩展的简单富文本编辑器场景，Tiptap 的配置和集成成本可能偏高。
常见问题
Tiptap 支持 Vue 3 / React 吗？
是的，Tiptap 是框架无关的，官方提供了对 Vue 3 和 React 的专门封装与详细集成指南。
Tiptap 能实现多人实时协作编辑吗？
可以，通过集成其官方协作后端 Hocuspocus 和 Yjs 库，Tiptap 能够轻松实现高性能的实时协同编辑功能。
给 AI 助手的安装指引
如果你的 AI 编程助手（Claude Code、Cursor、TRAE 等）能看到这个页面，把下面这段发给它即可自动完成安装：
请访问 https://321skill.com/skills/tiptap/raw/index.md 读取 tiptap 的原始 Skill 定义（Markdown 格式），按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址：/skills/tiptap/raw/index.md（查看排版版本）