HTML 转 Word 不丢格式怎么做？html-to-docx 实战指南

HTML 转 Word 不丢格式怎么做html-to-docx 实战指南【免费下载链接】html-to-docxHTML to DOCX converter项目地址: https://gitcode.com/gh_mirrors/ht/html-to-docx把网页渲染的报告发给客户时复制粘贴进 Word 会丢掉样式、表格错位。html-to-docx 是一个 JS 库把 HTML 字符串转成 DOCX 文件Word 2007、WPS、Google Docs、LibreOffice 都能直接打开。html-to-docx 是什么一个 npm 包当前版本 1.8.0MIT 协议。API 只有一个函数HTMLtoDOCX(html, header, options, footer)返回 Promise。Node 环境下解出来是 Buffer浏览器里是 Blob这段判断逻辑就在入口文件index.js里。手工做同一件事复制粘贴之后逐字重设字体、表框、页边距两个人做出来的结果都不一样。用这个库转换逻辑写一次第 300 份报告和第 1 份长得一样。底层分三步用 html-to-vdom 把 HTML 解析成 vdom把内联样式换算成 Word 属性边距、颜色、字号再用 xmlbuilder2 和 jszip 拼出完整的 Office Open XML 结构并打包成 zip。主转换逻辑在 src/html-to-docx.js文档结构由src/docx-document.js里的 DocxDocument 类组装。因为输出是标准 OOXML 而不是 Word 私有扩展Google Docs 和 LibreOffice 才能正常打开。服务端从 HTML 模板批量生成 Word 文件情境周报模板以 HTML 存在数据库里每天早八点要给客户群发 200 份带页脚的附件。这段脚本把 HTML 字符串转成 DOCX 并写到磁盘是项目示例 example/example-node.js 的精简版只缩短了 HTML 内容const fs require(fs); const HTMLtoDOCX require(html-to-docx); const html h1周报/h1pQ3 数据已更新。/p; (async () { const buffer await HTMLtoDOCX(html, null, { title: Q3 周报, font: Microsoft YaHei, footer: true, pageNumber: true, }); fs.writeFileSync(./report.docx, buffer); })();用好的关键点边距和页面尺寸既可以用 twip 数值也可以直接写px、cm、inch字符串src/utils/unit-conversion.js负责换算。1440 twip 是 1 英寸也就是标准页边距。table.row.cantSplit设为 true表格行就不会被跨页切断——这是表格看起来烂了最常见的来源。分页写在 HTML 里div classpage-break stylepage-break-after: always;/div这个 div 里的内容会被忽略保持空标签。图片同时支持 base64 data URI 和 http URL依赖 image-to-base64 和 image-size 处理嵌入服务端无需自己下载图片。前端侧给 React 页面加一个导出按钮情境让访客点一下按钮把当前渲染的报告页下载成 docx。这段代码取自项目自带的 React 示例example/react-example/核心只有调用和下载两步import HTMLtoDOCX from html-to-docx; import { saveAs } from file-saver; async function exportDocx(html) { const blob await HTMLtoDOCX(html, null, { font: Times New Roman, fontSize: 22, }); saveAs(blob, report.docx); }用好的关键点fontSize: 22对应 11pt。这个选项单位是 HIP半磅22 正好是 Word 正文默认字号。浏览器里返回值是 BlobMIME 类型已设为application/vnd.openxmlformats-officedocument.wordprocessingml.document配合 file-saver 就能触发下载。README 写明该库tested against React不是免构建的浏览器脚本需要打包器。项目自身用 rollup 产出 UMD 和 ESM 两种产物。上手前要知道的边界这部分都写在 README 的 Notes 和 Disclaimer 里但容易漏看字体不一致Word 桌面版遵循 fontTable.xml按你指定的字体显示LibreOffice 忽略这个文件自己找字体Word Online 从自己的字体库里取最接近的。跨平台交付时别把特殊字体当硬要求。有序列表支持 8 种list-style-typedecimal、lower-roman、upper-alpha 及括号变体并可用data-start属性从第 n 项开始编号。作者自己在 Disclaimer 里写了this is not a complete solution上线前拿自己业务里常见的 HTML 结构跑一遍验证。需要更深控制时的定制入口默认样式不合适时改的地方是 src/schemas/ 目录下的 XML 模板styles.js 放默认段落和表格样式numbering.js 是编号规则theme.js 和 settings.js 管主题与文档设置改完由src/docx-document.js组装进最终文档。想提交修改也简单重大改动先开 issue 讨论分支从 develop 切出。测试就一条命令npm test等于先 rollup 构建、再跑 example-node.js生成的 example.docx 用 Word 打开即可肉眼验收。四步拿到你的第一个 DOCX安装依赖npm install html-to-docx。准备 HTML 字符串样式尽量内联在标签里库不会去抓取外部 CSS。调用HTMLtoDOCX(html, headerHTML, options, footerHTML)header 和 footer 可传 null要页码必须同时footer: true。Node 端用 fs 保存 Buffer浏览器端用 file-saver 下载 Blob然后打开文件检查分页和字体。之后查选项看 README.md 的 Parameters 清单遇到转不过来的结构去项目 Issue 页搜一下或新建 issue修好了直接提 PR。【免费下载链接】html-to-docxHTML to DOCX converter项目地址: https://gitcode.com/gh_mirrors/ht/html-to-docx创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考