项目

tiptap 在你的编辑器中添加离线支持

通过集成 Y IndexedDB 扩展,轻松为协作编辑器添加离线功能。这个来自 Y.js 生态系统的工具为你的编辑器提供了本地数据存储和同步能力。

集成离线支持

首先,将 Y IndexedDB 支持添加到你的项目中:

npm install y-indexeddb

然后,将 Y Indexeddb 与 Y 文档连接起来,以便本地存储文档。

import { Editor } from "@tiptap/core";
import Collaboration from "@tiptap/extension-collaboration";
import * as Y from "yjs";
import { IndexeddbPersistence } from "y-indexeddb";

const ydoc = new Y.Doc();

// 为 Y 文档的本地存储设置 IndexedDB
new IndexeddbPersistence("example-document", ydoc);

const editor = new Editor({
  extensions: [
    // 其他扩展...
    Collaboration.configure({
      document: ydoc,
    }),
  ],
});

IndexedDB 支持会确保文档的每次更改都被本地保存在浏览器中。这意味着即使关闭标签页、失去网络连接或离线编辑,你的工作也会被保存。当你重新上线时,它会自动同步这些更改。

在本文档中