框架无关
标准 Web Components(Custom Elements)。Vue / React / Angular / 原生 HTML 直接写

常驻托盘,任务到达静默直打;把打印机共享给局域网内任意电脑;手机扫码传文件、拍照直印 —— 三件套开箱即用。见下载中心。
不装 npm、不写构建、不接后端 —— 浏览器直接进设计器。线上这份与 SDK 内置设计器同源,可以拿来评估「能不能干我的活」,也可以拿来先排好版、导出 JSON 再落到自己系统里。
打印从来不是「把模板画在一张白纸上」:先在设计器里把单据排出来,点打印,然后卷筒走纸、单据落出来。 预览里该看到的就是这一串动作的结果——下面这段把三步连起来演一遍:界面是真实的打印设计器, 纸上的内容是设计器内核渲染的同一张单据(全程未引入任何三方库):
① 设计 拖入表头、拖入数据表格(明细行自动循环、尾行合计)→ ② 打印 一键下发 → ③ 出纸 纸卷走纸、单据滑出。滑出来的那张,就是第一步里排的那张。 出纸能看到的约束提示(不可打印区越界告警 / 套打底图 / 热敏单色)见 预览纸张仿真。
视频演示 OpenPrint 在真实业务系统里的集成与打印效果:从模板设计、字段绑定到一键出纸的完整链路。
// ① 启动时配一次:把你的后端 / 请求器接进来
import axios from 'axios'
import { configurePrintKit, createHttpPrintAdapter } from 'openprint26'
configurePrintKit({
adapter: createHttpPrintAdapter({ request: (cfg) => axios.request(cfg).then((r) => r.data) }),
licenseKey: 'eyJkYXRh...', // 不配 = 试用模式
})
// ② 设计模板:全系统一个页面,零胶水代码
// <print-designer-page style="height:100vh" />
router.push('/system/print/designer?bizCode=PURCHASE_IN&tplCode=TPL_001')
// ③ 出纸:一行
import { quickPrint } from 'openprint26'
quickPrint('PURCHASE_IN', row.id)用户在你的系统里点开一张已存在的单据模板时,把后端 JSON 直接铺进画布:
import { defineDesignerHost } from 'openprint26'
const tpl = await myApi.getTemplate('TPL_001')
defineDesignerHost({
// 启动时自动载入,并接管 id / 名称(后续保存走 update)
initialTemplate: { id: tpl.id, name: tpl.name, data: tpl.json },
onSave: async ({ id, name, templateJson, action }) => {
const saved = await myApi.saveTemplate({ id, name, json: templateJson, action })
return { id: saved.id } // ★ 必须回传 id,否则每次保存都新建一条
},
})templateJson 是压缩版(无缩进)画布 JSON,比格式化版省约 45% 存储; 需要可读或二次加工则用 template(对象)。
每个字段的用法与案例见 API 总览 →。
适合谁
你是做 ERP / MES / WMS / 医疗 / 财务 / 物流 软件的团队?想把「报表 + 标签打印」做成自己产品里的一项能力, 又不想从零自研设计器、模板存储、打印驱动——OpenPrint 就是为这种「独立交付」场景设计的。
数据截至 2026-10-15。
每套单据一个报表文件,改一次抬头要动 30 多个文件并整体发版,客户提个微调需求就得排期。
接一个设计页 + 两个通用接口,模板存库、业务模块零代码,出纸一行 quickPrint。
底图由印刷厂预印,换包装要重新校版,对位全靠反复试打,一批下来废掉几百张标签。
底图上传后在设计器里直接对位,套打偏移烧进渲染产物、客户端零感知;预览里的连续纸与多联仿真先验完再上机。
门店抬头、桌号规则、打印机型号各不相同,总部每接一个新客户就改一次模板、发一次版。
门店在设计器里自助改模板并存回自己账号,总部只维护默认模板;热敏小票走 ESC 指令直通,不经过打印驱动。
foodbooking
为民科技
列国志食品
千机汇查
吉帝汽车
以上 logo 均已获相关企业授权展示。