Node.js 如何从基于JSON的HTMLSCSS模板生成PDF

最后，我能够使用react-pdf和bwipjs库创建我想要的标签. 最大的问题是我如何在PDF中写入条形码，我发现在bwipjs的帮助下，可以生成并将其转换为画布，然后在PDF中作为图像，然后在import { StyleSheet } from "@react-pdf/renderer";的帮助下 您可以设计元素并将它们放在所需的位置.

下面是一个小代码示例.

import { Document, Page, Text, View, Image, StyleSheet } from '@react-pdf/renderer';

const styles = StyleSheet.create({
  labelContainer: {
    // Define container styles
  },
  text: {
    // Define text styles
  },
  // Define styles for other elements
});

function RenderLabel({ labelData }) {
  return (
    <Document>
      <Page>
        <View style={styles.labelContainer}>
          {/* Render text elements */}
          <Text style={styles.text}>{labelData.shipment_details.from.company}</Text>
          {/* Insert barcode images */}
          <Image src={barcodeImageData} />
          {/* Add other elements as needed */}
        </View>
      </Page>
    </Document>
  );
}

这里是如何生成条形码，然后画布和返回dataUrl

import bwipjs from 'bwip-js';

async function generateBarcodeDataURL(options) {
  return new Promise((resolve) => {
    bwipjs.toCanvas('myCanvas', options, (info, canvas) => {
      resolve(canvas.toDataURL('image/png'));
    });
  });
}