一个全能的electron打印插件electron-pos-printer

admin · 发表于 2024-10-19 17:59:15

可以一键打印图片、文本、二维码、条形码、表格

不用安装其他多余插件，亲测十分好用

electron-pos-printer

1、安装

npm install electron-pos-printer
yarn add electron-pos-printer

复制代码

2、使用

在main主进程中引入

const {PosPrinter} = require("electron-pos-printer");

复制代码

在render渲染进程中引入

const {PosPrinter} = require('electron').remote.require("electron-pos-printer");

复制代码

定义参数

const printOptions = {
preview: false, // 打印预览
width: '80px', // 宽度
margin: '0 0 0 0', // 外边距
copies: 1, // 打印页数
printerName: '', // 打印机名称
timeOutPerLine: 400, //超时时间
pageSize: { height: 301000, width: 71000 } // 页面大小
}

复制代码

注意：

页面大小需要根据你的纸张大小自己调试

打印机名称通过remote.getCurrentWebContents().getPrinters()获取

开始打印二维码

/**
* 去打印
* value:二维码数据
* textLeft:文本左边距距离
*/
_toPrint(value, textLeft) {
const printerName = new Store().get('printerName')
if (!printerName) {
//请先选择打印机
this.showSelPrintModal = true
return
}
const data = [
{
type: 'qrCode',
value,
height: 100,
width: 100,
displayValue: true, // Display value below barcode
style: `margin-left:80px;`,
},
{
type: 'text',
value,
style: `margin-left:${textLeft}px;`,
},
]
printOptions = { ...printOptions, printerName }
PosPrinter.print(data, printOptions)
.then(() => {})
.catch((error) => {
console.error('打印错误', error)
})
},

复制代码

说明：先获取打印机名称，然后调用插件打印，边距需要调式这个距离

打印成果（纸张是700*500）

一个全能的electron打印插件electron-pos-printer

打印条形码也是如此（修改一下data）

const data = [
{
type: 'barCode',
value,
height: 110,
width: 1,
displayValue: true, // 是否显示数值
fontsize: 16,
style: `margin-left:${left}px;`,
},
]

复制代码

大功告成!!!

还有表格、图片我就不演示了，直接上作者demo

const {PosPrinter} = require("electron-pos-printer");
const path = require("path");
const options = {
preview: false, // Preview in window or print
width: '170px', // width of content body
margin: '0 0 0 0', // margin of content body
copies: 1, // Number of copies to print
printerName: 'XP-80C', // printerName: string, check with webContent.getPrinters()
timeOutPerLine: 400,
pageSize: { height: 301000, width: 71000 } // page size
}
const data = [
{
type: 'image',
path: path.join(__dirname, 'assets/banner.png'), // file path
position: 'center', // position of image: 'left' | 'center' | 'right'
width: '60px', // width of image in px; default: auto
height: '60px', // width of image in px; default: 50 or '50px'
},{
type: 'text', // 'text' | 'barCode' | 'qrCode' | 'image' | 'table
value: 'SAMPLE HEADING',
style: `text-align:center;`,
css: {"font-weight": "700", "font-size": "18px"}
},{
type: 'text', // 'text' | 'barCode' | 'qrCode' | 'image' | 'table'
value: 'Secondary text',
style: `text-align:left;color: red;`,
css: {"text-decoration": "underline", "font-size": "10px"}
},{
type: 'barCode',
value: 'HB4587896',
height: 12, // height of barcode, applicable only to bar and QR codes
width: 1, // width of barcode, applicable only to bar and QR codes
displayValue: true, // Display value below barcode
fontsize: 8,
},{
type: 'qrCode',
value: 'https://github.com/Hubertformin/electron-pos-printer',
height: 55,
width: 55,
style: 'margin: 10 20px 20 20px'
},{
type: 'table',
// style the table
style: 'border: 1px solid #ddd',
// list of the columns to be rendered in the table header
tableHeader: ['Animal', 'Age'],
// multi dimensional array depicting the rows and columns of the table body
tableBody: [
['Cat', 2],
['Dog', 4],
['Horse', 12],
['Pig', 4],
],
// list of columns to be rendered in the table footer
tableFooter: ['Animal', 'Age'],
// custom style for the table header
tableHeaderStyle: 'background-color: #000; color: white;',
// custom style for the table body
tableBodyStyle: 'border: 0.5px solid #ddd',
// custom style for the table footer
tableFooterStyle: 'background-color: #000; color: white;',
},{
type: 'table',
style: 'border: 1px solid #ddd', // style the table
// list of the columns to be rendered in the table header
tableHeader: [{type: 'text', value: 'Animal'}, {type: 'image', path: path.join(__dirname, 'icons/animal.png')}],
// multi dimensional array depicting the rows and columns of the table body
tableBody: [
[{type: 'text', value: 'Cat'}, {type: 'image', path: './animals/cat.jpg'}],
[{type: 'text', value: 'Dog'}, {type: 'image', path: './animals/dog.jpg'}],
[{type: 'text', value: 'Horse'}, {type: 'image', path: './animals/horse.jpg'}],
[{type: 'text', value: 'Pig'}, {type: 'image', path: './animals/pig.jpg'}],
],
// list of columns to be rendered in the table footer
tableFooter: [{type: 'text', value: 'Animal'}, 'Image'],
// custom style for the table header
tableHeaderStyle: 'background-color: #000; color: white;',
// custom style for the table body
tableBodyStyle: 'border: 0.5px solid #ddd',
// custom style for the table footer
tableFooterStyle: 'background-color: #000; color: white;',
},
]
PosPrinter.print(data, options)
.then(() => {})
.catch((error) => {
console.error(error);
});

复制代码

很好用的一个打印工具插件！！！

游客，本帖隐藏的内容需要积分高于 2 才可浏览，您当前积分为 0

提取码下载：

文件名称:提取码下载.txt
下载次数:0 文件大小:16 Bytes 售价:5金钱 [记录]
下载权限: 不限 [购买VIP] [充值] [在线充值] 【VIP会员5折；永久VIP免费】

安全检测，请放心下载

		自动登录	找回密码
密码			立即注册

一个全能的electron打印插件electron-pos-printer

相关帖子