使用模块 @react-pdf/renderer 时出现错误“render is a Node Specific API”

Zhi*_*har 10 pdf pdf-generation typescript reactjs react-pdf

@react-pdf/renderer使用官方示例模块( https://snyk.io/advisor/npm-package/@react-pdf/renderer):

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

    // Create styles
    const styles = StyleSheet.create({
        page: {
        flexDirection: 'row',
        backgroundColor: '#E4E4E4'
        },
        section: {
        margin: 10,
        padding: 10,
        flexGrow: 1
        }
    });
    
    // Create Document Component
    const MyDocument = (): JSX.Element => (
        <Document>
            <Page size="A4" style={styles.page}>
                <View style={styles.section}>
                    <Text>Section #1</Text>
                </View>
                <View style={styles.section}>
                    <Text>Section #2</Text>
                </View>
            </Page>
        </Document>
    );

    ReactPDF.render(<MyDocument />, `example.pdf`);
Run Code Online (Sandbox Code Playgroud)

但我收到一个错误:

错误:渲染是特定于 Node 的 API。您要么在浏览器中使用此方法,要么您的捆绑程序没有从适当的 Web 构建加载react-pdf。

请告诉我为什么会出现此错误以及如何修复它

小智 8

render 函数仅在服务器上工作,而 React 在客户端上工作,如果您想在浏览器中渲染,请检查 ReactDOM.render 函数是否使用 PDFViewer 组件。