快速入门
选择接入方式
根据技术栈与持久化需求，在 ESM、CDN 或在线 Playground 之间选择。
选择接入方式
SVeditor 在各接入方式下使用同一套运行时。差异在于 如何加载 与 如何保存文档。有 bundler 时默认选 ESM 包。
决策表
| 场景 | 路径 | 说明 |
|---|---|---|
| React / Next.js / Vite | ESM 包 | 默认 — @wztlink1013/sveditor |
| Next.js App Router | React / Next.js | SSR 安全挂载 + 稳定 options |
| 无 bundler（传统 HTML、CMS） | CDN | window.SVeditor |
| 先做 API 前在线体验 | Playground | 在线自动保存示例 |
| 自有 REST 存储 | ESM 或 CDN + 自动保存 | 推荐持久化模型 |
ESM 包（默认）
适合： 新建 React / Next.js 项目。
- 完整的
EditorOptions、extensionsOptionsTypeScript 类型。 - 与 CDN 配置形状一致，选定一种加载方式即可。
- 需 npm 安装，见 安装。
注意： 不要在 Server Component 中 import SDK，使用客户端边界 — ESM 集成。
CDN（UMD）
适合： 无法使用 bundler 的宿主。
- 无需构建；React 已打入 UMD。
- 生产环境锁定 CDN 版本号。
配置仍通过 SVeditor.create({ extensionsOptions: { ... } })。上传与保存回调指向 你的 HTTP 接口。
在线 Playground
适合： 在编写后端前，先看自动保存、上传、元数据、AI 的完整接线。
- Playground — 本地存储，无需登录。
- 自动保存演示 — 登录后远程持久化。
见 演练场。
持久化模型
| 模型 | 正文存储 | 适用 |
|---|---|---|
静态 content | 每次挂载传入 | 只读或预览 |
autoSave | onSaveContent | 单编辑器、debounce 保存 |
autoSave + meta | 正文 + 独立 meta 回调 | 内建标题 / 封面 UI |