bwip-js

For high-quality, scalable barcodes in PDF documents, use the pdfkit library. The project provides examples for adding barcodes as PDF graphics:

• examples/pdfkit.js: Server-side PDF generation.
• examples/drawing-pdfkit.js: Browser-compatible version for client-side PDF generation.

When using Electron, it is recommended to use the @bwip-js/node package instead of the main bwip-js package to avoid potential issues with bundler interactions with package exports. You can use toBuffer to generate a barcode as a buffer and then convert it to a base64 data URI for display in an <img> tag.

<script>
  var bwipjs = require('@bwip-js/node');
  bwipjs.toBuffer({ bcid:'qrcode', text:'0123456789' }, function (err, png) {
      if (err) {
        document.getElementById('output').textContent = err;
      } else {
        document.getElementById('myimg').src = 'data:image/png;base64,' + png.toString('base64');
      }
    });
</script>

You can use bwipjs.request(req, res) to create an HTTP server that renders barcodes based on URL query parameters. The handler ignores the URL path and only operates on the query string.

Example URL structure: http://localhost:3030/?bcid=isbn&text=978-1-56581-231-4+52250&includetext&guardwhitespace

// Simple HTTP server that renders barcode images using bwip-js.
const http   = require('http');
const bwipjs = require('bwip-js');

http.createServer(function(req, res) {
    if (req.url.indexOf('/?bcid=') != 0) {
        res.writeHead(404, { 'Content-Type':'text/plain' });
        res.end('BWIPJS: Unknown request format.', 'utf8');
    } else {
        bwipjs.request(req, res); // Executes asynchronously
    }
}).listen(3030);

You can install the main cross-platform package or specific platform-optimized packages. If the main package's exports do not work with your build stack, use one of the platform-specific packages. Note that platform-specific packages are ES modules only (except for the @bwip-js/node package, which also supports require()).

Main package:

npm install bwip-js

Platform-specific packages:

• Node.js: @bwip-js/node (includes toBuffer())
• Browser: @bwip-js/browser (includes toCanvas())
• React Native: @bwip-js/react-native (includes toDataURL())
• Generic: @bwip-js/generic (SVG and custom drawing context only)

Generating barcodes (especially 2D barcodes) is CPU intensive and can take 100ms - 250ms per operation. To prevent blocking the Node.js event loop, you should offload generation to secondary processes or threads.

Available patterns in the examples include:

• Single-process: A basic single-threaded server (server.js).
• Process Clustering: Using a master process to manage one bwip-js process per CPU, with automatic relaunching (cluster.js).
• Multi-threading: A single-process, multi-threaded server using Node.js worker threads (requires Node.js 10.5 or higher) (threaded.js).

A bwip-js barcode service is available online to serve barcode images on demand. You can embed these URLs in HTML documents or retrieve them from non-JavaScript servers.

Note: For JavaScript-based servers, it is recommended to use the bwip-js code directly for better performance rather than calling the online API.

For modern bundlers or ESM environments, you can import bwipjs from the main package or the platform-specific @bwip-js/browser package.

To enable tree-shaking and reduce bundle size, you can import individual encoders as named exports. The exported names match the bcid names, but dashes (-) are replaced with underscores (_). For example, gs1-128 becomes gs1_128.

import bwipjs from 'bwip-js';           // Main package
// or
import bwipjs from '@bwip-js/browser';  // Platform-specific

// Tree-shaking individual encoders:
import { gs1_128 } from 'bwip-js';

try {
    gs1_128('my-canvas', options);
} catch (e) {
    // `e` may be a string or Error object
}

The bwip-js command-line interface allows you to generate barcode images (PNG or SVG) directly from your terminal. You can provide the symbol name and text as positional arguments or via flags, followed by any configuration options and the output filename.

Basic Syntax:

# Using positional arguments
bwip-js <symbol-name> <text> [options...] <output-file>.

# Using explicit flags
bwip-js --bcid=<symbol-name> --text=<text> [options...] <output-file>

Examples:

# Generate a Code 128 barcode with red text
bwip-js code128 012345678 includetext textcolor=ff0000 my-code128.png

# Generate a QR code as an SVG
bwip-js qrcode 'https://bwip-js.metafloor.com' qrcode.svg

If you need to display a barcode using an <img> tag or CSS background-image instead of a <canvas> element, you can render to a detached or hidden canvas and then extract the data URL using HTMLCanvasElement.toDataURL().

let canvas = document.createElement('canvas');
try {
    bwipjs.toCanvas(canvas, options);
    document.getElementById('my-img').src = canvas.toDataURL('image/png');
} catch (e) {
    // `e` may be a string or Error object
}