word-editor

Production DOCX editor

word-editor

面向浏览器应用的专业 DOCX 编辑器。以经典蓝色 ribbon、授权门禁、异步字体、Worker 文档解析和可嵌入 Web Component，承载生产级文档编辑体验。

打开在线 Demo 阅读文档
Runtime
Pure TypeScript + Worker
Security
WASM license gate
UI
Word-style ribbon
Platform

为真实业务系统准备的 DOCX 编辑核心

主页即产品入口：团队可以从 Demo 验收文档能力，也可以直接从 API 文档嵌入到自己的 SaaS、OA、合同、知识库和审批系统。

W

Word 风格编辑面

经典蓝色 ribbon、视图开关、标尺、段落样式、对象插入、表格工具和右键上下文菜单面向高频编辑流程组织。

A

应用内嵌入 API

通过 <word-editor> Web Component 加载、保存、执行命令、导入图片、注册字体，并用事件接入宿主业务状态。

S

生产授权与交付

授权文件、WASM 门禁、Cloudflare Pages 部署产物、混淆压缩和发布元数据在构建流程中集中处理。

Developer Experience

几行代码完成加载、编辑和保存

运行时以原生 Custom Element 暴露，适配任意前端框架。宿主应用负责选择文件、授权、存储、协作和审计策略，编辑器负责 DOCX 解析、渲染、命令和导出。

快速开始 事件模型 字体网关 
<word-editor id="editor"
  mode="edit"
  auto-font-gateway
  font-gateway-url="https://font.flyfish.group/manifest.json">
</word-editor>

<script type="module">
  import "/packages/word-editor/dist/index.js";

  const editor = document.querySelector("#editor");
  await editor.load(file, file.name);
  await editor.exec("bold");
  const docx = await editor.save();
</script>
Architecture

加载不卡顿，授权可控，字体异步补齐

生产路径把重任务拆到后台，并把用户可见状态留在前台：文档先可见，字体、分页和保存状态再逐步回显。

  1. 01

    License gate

    入口校验授权和部署域名，失败时渲染明确的授权错误面板。

  2. 02

    Worker loading

    DOCX 解包和文档模型准备放入 Worker，避免阻塞 ribbon 和正文交互。

  3. 03

    Async fonts

    字体网关后台加载，底部状态回显进度，字体就绪后重排页面。

  4. 04

    Command surface

    ribbon、右键菜单和 API 命令统一走编辑器命令层，保持选区和状态同步。

Documentation

文档站已覆盖上线集成所需内容

包含安装方式、元素属性、方法、命令、事件、字体网关、授权部署、错误处理和生产检查清单。

API Reference Web Component、方法、事件、命令和 TypeScript 类型 Deployment Cloudflare Pages、授权文件、WASM、缓存和发布验证 Operations 字体、性能、错误、测试、版本发布和宿主集成边界