条码/二维码 bwip-js

Q: 条码打印清晰吗？

清晰。渲染核心为 bwipjs.toSVG，输出矢量 SVG，打印不失真；可通过 bwipScale 调整缩放（"X,Y" 格式）、bwipPaddingX/Y 调整内边距、includeText 控制是否在条码下方显示码值。

约 715 字大约 2 分钟

...

2026-09-28

插件说明

@sv-print/plugin-ele-bwip-js 基于 bwip-js 的条码/二维码打印元素插件：导出 barcode（条形码）与 qrcode（二维码）两种元素类型，渲染核心为 bwipjs.toSVG(opts)，覆盖 100+ 码制规范（EAN/UPC、Code 128、GS1、PDF417、Data Matrix、QR Code、汉信码等）。

第三方依赖：bwip-js。

npm install @sv-print/plugin-ele-bwip-js

示例代码

import pluginEleBwip from '@sv-print/plugin-ele-bwip-js';
const plugins = [
  pluginEleBwip({
    // 不传则使用内置默认类型清单
    barcodeTypeList: [{ title: 'EAN-13', value: 'ean13' }],
    qrcodeTypeList: [{ title: 'QR Code', value: 'qrcode' }],
  }),
];

await hiprint.register({ plugins }); // 须在创建模板/打开设计器之前

注册后设计器左侧「插件」分组出现「条形码 / 二维码」元素。内置默认类型清单按「零售商品码 / 通用一维条码 / 物流编码 / 邮政编码 / 医疗产品编码 / GS1 DataBar / 堆叠式条码 / 复合编码 / 附加组件」等分组；全量码制参见 bwip-js 官方仓库。

高级用法

条形码（barcode）参数

参数	说明
`barcodeType`	条码类型，默认 code128，支持 ean13/ean8/upca/code39/itf14/gs1-128/pdf417/databaromni 等全量 bwip 标识
`bwipScale`	缩放，"X,Y" 格式，如 "2,2"
`bwipPaddingX` / `bwipPaddingY`	水平 / 垂直内边距，"左,右" / "上,下" 格式
`includeText`	条码下方显示码值
`hideTitle`	隐藏标题
`upperCase`	码值转大写
`bwipDraw`	自定义绘制函数字符串，签名 `(text, opts, options, templateData, target, bwipjs)`，返回 svg

二维码（qrcode）参数

参数	说明
`qrcodeType`	二维码类型：qrcode / azteccode / datamatrix / hanxin / dotcode 等
`qrCodeLevel`	容错等级：1=L(7%)；0=M(15%)；3=Q(25%)；2=H(30%)
其余参数	同条形码（bwipScale、includeText、bwipDraw 等）

插件 config

参数	说明
`barcodeTypeList`	自定义条码类型清单 `{title, value?, group?}[]`，`group: true` 表示分组标题项
`qrcodeTypeList`	自定义二维码类型清单，格式同上

条码/二维码 bwip-js

插件说明

示例代码

高级用法

条形码（barcode）参数

二维码（qrcode）参数

插件 config

常见问题

支持哪些条码/二维码类型？

条码打印清晰吗？

版权所有