node.js - 如何在后端nodeJs中使用带有图像和字体的@react-pdf/renderer

Question

我有一个nodeJs应用程序，我想使用@react-pdf/renderer在后端创建pdf图书馆。我的 pdf 包含图像和外部字体。有什么办法可以做到这一点吗？提前致谢..

Answer 1

由于您使用的是@react-pdf/renderer，因此您需要在nodejs中安装react。所以你应该有 es6 支持。

为此安装这些软件包

"@babel/core": "^7.12.17",
"@babel/preset-env": "^7.12.17",
"@babel/preset-react": "^7.16.5",
"babel-cli": "^6.26.0",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-preset-stage-0": "^6.24.1",
"babel-runtime": "^6.26.0",

使用此内容创建 .babelrc 文件

{
  "presets": [
    "@babel/preset-env",
    "@babel/preset-react"
  ],
  "plugins": [
    [
      "@babel/transform-runtime"
    ]
  ]
}

你的脚本应该是这样的

"scripts": {
    "start": "node dist/index.js", # Your Path 
    "dev": "babel-node src/index.js", # Your Path 
    "build": "babel src -d dist", # If using build
  },

完成配置后，您可以按如下方式使用@react-pdf/renderer

import React from 'react';
import ReactPDF from '@react-pdf/renderer';

const pdfStream = await ReactPDF.renderToStream(<MyDocument />);
res.setHeader('Content-Type', 'application/pdf');
pdfStream.pipe(res);
pdfStream.on('end', () => console.log('Done streaming, response sent.'));

更多详情请参阅https://react-pdf.org/advanced#usage-with-express.js