安装依赖时警告:
在安装依赖的时候,可能出现如下的警告:
Ignored build scripts: esbuild.
Run “pnpm approve-builds” to pick which dependencies should be allowed to run scripts.
这个警告是 pnpm 从 v8 开始引入的新特性:构建脚本安全机制
出于安全考虑,pnpm 默认会忽略某些依赖包的构建脚本(build scripts),比如 esbuild,除非你明确允许它们运行。
这是为了防止依赖包在安装时偷偷执行恶意代码,比如一些 postinstall 脚本可能会做:
- 下载远程二进制
- 修改本地文件
- 甚至执行你不希望执行的 shell 命令
所以 pnpm 现在默认屏蔽这些行为,只有你“批准”的包才允许运行构建脚本。
安装依赖:
pnpm add quill quill-cursors yjs y-quill y-websocket依赖说明:
-
quill:Quill 是一个开源、模块化的 WYSIWYG 富文本编辑器,支持格式化文字、插入图片、列表、代码块等。
- what you see is what you get:所见即所得
-
quill-cursors:这个库扩展了 Quill,使其支持在协同编辑中显示多个用户的“光标位置”和“选中区域”,通常会以彩色的虚线框或用户名标签表示。
-
yjs:Yjs 是一个高性能的 CRDT 库,可以让多个用户在没有冲突的情况下协同编辑共享数据。
-
y-quill:这个库是 Yjs 提供的绑定器(binding),可以把 Quill 的编辑器内容和 Yjs 的共享文档(Y.Text)同步起来。从而实现实时协同富文本编辑。
-
y-websocket:y-websocket 提供了一个 WebSocket 客户端和服务器端实现,用于在多用户之间同步 Yjs 文档数据,从而保持文档在所有客户端之间的实时一致性。
Yjs 会优先通过浏览器同 host 共享状态的方式进行通信,然后才是网络通信。因此一开始即便 websocket 没有连接上,同一个浏览器的两个 tab 是可以进行协同的。
整体架构如下:
浏览器 A 浏览器 B │ │ ▼ ▼Quill 编辑器 Quill 编辑器 │ │ ▼ ▼y-quill y-quill │ │ ▼ ▼Yjs (y.Doc) Yjs (y.Doc) │ │ └───────▶ WebSocket ◀───────┘ (y-websocket)-EOF-