Flexible Barcode Generator In Vue.js 3

Install & Download:

# Yarn
$ yarn add vue@3 jsbarcode@3 @chenfengyuan/vue-barcode@2
# NPM
$ npm i vue@3 jsbarcode@3 @chenfengyuan/vue-barcode@2

Description:

A Vue.js component used to generate customizable barcodes using JsBarcode library.

How to use it:

1. Import and register the Barcode Generator.

import { createApp } from 'vue';
import VueBarcode from '@chenfengyuan/vue-barcode';
const app = createApp({});
app.component(VueBarcode.name, VueBarcode);

2. Add the <vue-barcode /> component to the app

<vue-barcode value="VueScript" :options="{ JsBarcode Options }"></vue-barcode>

3. Default component props.

/**
 * The value of the bar code.
 */
value: {
  type: String,
  default: undefined,
},
/**
 * The options for the bar code generator.
 * {@link https://github.com/lindell/JsBarcode#options}
 */
options: {
  type: Object,
  default: undefined,
},
/**
 * The tag name of the component's root element.
 */
tag: {
  type: String,
  default: 'canvas',
},