1.0.3 • Published 2 years ago

@dailykit/xml-escpos-helper v1.0.3

Weekly downloads
-
License
Apache-2.0
Repository
github
Last release
2 years ago

Originally forked from here

ESC/POS XML

Cross platform JavaScript library that implements the thermal printer ESC / POS protocol and provides an XML interface for preparing templates for printing.

Features

  • Text
  • Text line
  • Feed line
  • Bold text
  • Underline text
  • Font size
  • Small mode
  • White mode
  • Align
  • Barcode
  • QRcode
  • Paper cut node
  • Image (base64) (png only)
  • XML with mustache

Tested manually on following environments or platforms

  • React Native (Android)
  • React Native (iOS)
  • React Native Web
  • Server side (NodeJs)
  • Desktop applications (nwjs & electron)
  • Other node environment (terminal)

Installation

  yarn add @dailykit/xml-escpos-helper

Examples

With an XML template + plain object input (regular text).

import { EscPos } from '@dailykit/xml-escpos-helper';

// store this template somewhere `s3` or as `static asset` based on your preference
const template = `
  <?xml version="1.0" encoding="UTF-8"?>
  <document>
    <align mode="center">
      <bold>
        <text-line size="1:0">{{title}}</text-line>
      </bold>
    </align>

    {{#thankyouNote}}
    <align mode="center">
      <text-line encoding="cp864" codepage="22" size="0:0">  {{{thankyouNote}}}</text-line>
    </align>

    <line-feed />

    <paper-cut />
  </document>
`;

// if encoding & codepage in text-line is not mentioned (by default it is set to utf8 & 0 respectively)

const input = {
  title: 'Sample',
  thankyouNote: 'أهلا بك',
};

const options = {
  wrapWord: false, //true by default
  wrapWordMaxLength: 48, // 32 by default
};

const buffer = EscPos.getBufferFromTemplate(template, input, options);
// send this buffer to a stream (eg.: bluetooth or wifi)

With an XML template + png image (base64)

const template = `<?xml version="1.0" encoding="UTF-8"?>
  <document>
    <align mode="center">
      <bold>
        <text-line size="1:0">{{title}}</text-line>
      </bold>

      <image density="d24">
        {{base64PngImage}}
      </image>
    </align>
  </document>`;

const input = {
  title: 'PNG - base64',
  base64PngImage: `data:image/png;base64,iVBORw0KGgoAAA+P/AaNn2GPEMgEFAAAAAElFTkSuQmCC`,
};

const buffer = EscPos.getBufferFromTemplate(template, input);

TODO

  • Font styles (font family)
  • Image bitmap conversion improvements
  • jpeg support
  • Add example apps to repo
  • Removed uglify for some reason, need to bring it back
  • Improve image rendering

Common issues

  • If there is any delay you observe while printing with this library it is mostly due to image manipulations (try without image :mask: )

Useful links / resources

Limitations on the react-native framework

  • FileReader.readAsArrayBuffer was not implemented.
  • Most of popular image manupulation libraries does not have support for react-native. eg : jimp, jpeg-js and sharp. We can use these libraries with some native node lib implemented in react native (some sort of polyfill).
  • For png this library seems to be faster, but when tested this library with it, it is not retaining pixels at some places)
  • Use this node-libs-react-native if we need to use this library in react native (adds some mock or js implementation for fs, stream etc)

Contributions of any kind welcome! :heart: