使用Vite打包含@react-pdf/renderer的Node库时renderToStream报错求助

问题背景 #

用Vite打包依赖@react-pdf/renderer的Node类库，导出getPdf函数调用renderToStream，在Node环境中调用时出现错误：

Error: renderToStream is a Node specific API. You're either using this method in a browser, or your bundler is not loading react-pdf from the appropriate web build.

目标是让bundle包含所有依赖代码（包括@react-pdf/renderer），仅排除path、fs等Node内置模块，无需外部导入该库。

问题原因 #

@react-pdf/renderer在package.json中定义了多环境入口（如browser、main），Vite/Rollup默认的模块解析逻辑可能误选了浏览器版本的代码，而非Node版本，导致Node专属API报错。

解决方案 #

修改Vite配置，强制Rollup解析@react-pdf/renderer时优先选用Node环境的入口，并正确配置内置模块排除规则：

1. 安装必要的Rollup插件：

npm install @rollup/plugin-node-resolve @rollup/plugin-commonjs --save-dev

2. 更新Vite配置文件：

import { defineConfig } from 'vite';
import { resolve } from 'path';
import nodeResolve from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';

export default defineConfig({
  build: {
    lib: {
      entry: resolve(__dirname, 'src/generatePdf.tsx'),
      name: 'GeneratePDF',
      fileName: (format) => `generatePDF.${format}.js`,
      formats: ['cjs'],
    },
    target: 'node16',
    outDir: resolve(__dirname, 'dist'),
    rollupOptions: {
      plugins: [
        nodeResolve({
          // 明确指定为Node环境，禁用浏览器解析逻辑
          browser: false,
          // 优先使用package.json中的main/module字段对应Node版本
          mainFields: ['main', 'module'],
          preferBuiltins: true,
        }),
        commonjs(),
      ],
      // 仅排除Node内置模块，不排除@react-pdf/renderer
      external: ['path', 'fs', 'stream', 'crypto'], // 根据需要添加其他内置模块
    },
  },
});

关键配置说明 #

• nodeResolve的browser: false：告诉插件按Node环境解析模块，不会选用浏览器专属的代码分支。
• mainFields: ['main', 'module']：强制优先加载@react-pdf/renderer的Node版本入口（其package.json的main字段指向Node环境代码）。
• external仅列出Node内置模块：确保@react-pdf/renderer被打包进bundle，无需外部依赖。

验证方法 #

打包后查看dist目录下的bundle文件，搜索renderToStream相关代码，确认其引用的是Node环境的实现（而非浏览器版本的占位代码）。此时在Node Express应用中导入bundle的getPdf函数即可正常调用。

内容的提问来源于stack exchange，提问作者Oki