[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-3825":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":11,"languages":10,"totalLinesOfCode":10,"stars":12,"forks":13,"watchers":14,"openIssues":15,"contributorsCount":16,"subscribersCount":16,"size":16,"stars1d":17,"stars7d":18,"stars30d":19,"stars90d":16,"forks30d":16,"starsTrendScore":20,"compositeScore":21,"rankGlobal":10,"rankLanguage":10,"license":22,"archived":23,"fork":23,"defaultBranch":24,"hasWiki":23,"hasPages":23,"topics":25,"createdAt":10,"pushedAt":10,"updatedAt":30,"readmeContent":31,"aiSummary":32,"trendingCount":16,"starSnapshotCount":16,"syncStatus":17,"lastSyncTime":33,"discoverSource":34},3825,"react-pdf","diegomura\u002Freact-pdf","diegomura","📄  Create PDF files using React","https:\u002F\u002Freact-pdf.org",null,"TypeScript",16621,1328,104,353,0,2,12,47,10,44.37,"MIT License",false,"master",[26,27,28,29],"flexbox","pdf","react","renderer","2026-06-12 02:00:54","\u003Cp align=\"center\">\n  \u003Cimg src=\"https:\u002F\u002Fuser-images.githubusercontent.com\u002F5600341\u002F27505816-c8bc37aa-587f-11e7-9a86-08a2d081a8b9.png\" height=\"280px\">\n  \u003Cp align=\"center\">React renderer for creating PDF files on the browser and server\u003Cp>\n  \u003Cp align=\"center\">\n    \u003Ca href=\"https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002F@react-pdf\u002Frenderer\">\n      \u003Cimg src=\"https:\u002F\u002Fimg.shields.io\u002Fnpm\u002Fv\u002F@react-pdf\u002Frenderer?style=flat&colorA=000000&colorB=000000\" \u002F>\n    \u003C\u002Fa>\n     \u003Ca href=\"https:\u002F\u002Fopencollective.com\u002Freact-pdf\">\n      \u003Cimg src=\"https:\u002F\u002Fimg.shields.io\u002Fopencollective\u002Fall\u002Freact-pdf?style=flat&colorA=000000&colorB=000000\" \u002F>\n    \u003C\u002Fa>\n    \u003Ca href=\"https:\u002F\u002Fgithub.com\u002Fdiegomura\u002Freact-pdf\u002Fblob\u002Fmaster\u002FLICENSE\">\n      \u003Cimg src=\"https:\u002F\u002Fimg.shields.io\u002Fgithub\u002Flicense\u002Fdiegomura\u002Freact-pdf?style=flat&colorA=000000&colorB=000000\" \u002F>\n    \u003C\u002Fa>\n    \u003Ca href=\"https:\u002F\u002Fblockchain.com\u002Fbtc\u002Faddress\u002Fbc1qj223udztpmt5dck46dw0yap08yum63ht56h90v\">\n      \u003Cimg src=\"https:\u002F\u002Fimg.shields.io\u002Fbadge\u002FBTC-f5f5f5?style=flat&colorA=000000&colorB=000000\" \u002F>\n    \u003C\u002Fa>\n     \u003Ca href=\"https:\u002F\u002Fblockchain.com\u002Feth\u002Faddress\u002F0x4e1DB76bA0858BbCAa4DD804418D0D9EcF77B1cC\">\n      \u003Cimg src=\"https:\u002F\u002Fimg.shields.io\u002Fbadge\u002FETH-f5f5f5?style=flat&colorA=000000&colorB=000000\" \u002F>\n    \u003C\u002Fa>\n  \u003C\u002Fp>\n\u003C\u002Fp>\n\n## Lost?\n\nThis package is used to _create_ PDFs using React. If you wish to _display_ existing PDFs, you may be looking for [react-pdf](https:\u002F\u002Fgithub.com\u002Fwojtekmaj\u002Freact-pdf).\n\n## How to install\n\n```sh\nyarn add @react-pdf\u002Frenderer\n```\n\n## How it works\n\n```jsx\nimport React from 'react';\nimport { Document, Page, Text, View, StyleSheet } from '@react-pdf\u002Frenderer';\n\n\u002F\u002F Create styles\nconst styles = StyleSheet.create({\n  page: {\n    flexDirection: 'row',\n    backgroundColor: '#E4E4E4',\n  },\n  section: {\n    margin: 10,\n    padding: 10,\n    flexGrow: 1,\n  },\n});\n\n\u002F\u002F Create Document Component\nconst MyDocument = () => (\n  \u003CDocument>\n    \u003CPage size=\"A4\" style={styles.page}>\n      \u003CView style={styles.section}>\n        \u003CText>Section #1\u003C\u002FText>\n      \u003C\u002FView>\n      \u003CView style={styles.section}>\n        \u003CText>Section #2\u003C\u002FText>\n      \u003C\u002FView>\n    \u003C\u002FPage>\n  \u003C\u002FDocument>\n);\n```\n\n### `Web.` Render in DOM\n\n```jsx\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport { PDFViewer } from '@react-pdf\u002Frenderer';\n\nconst App = () => (\n  \u003CPDFViewer>\n    \u003CMyDocument \u002F>\n  \u003C\u002FPDFViewer>\n);\n\nReactDOM.render(\u003CApp \u002F>, document.getElementById('root'));\n```\n\n### `Node.` Save in a file\n\n```jsx\nimport React from 'react';\nimport ReactPDF from '@react-pdf\u002Frenderer';\n\nReactPDF.render(\u003CMyDocument \u002F>, `${__dirname}\u002Fexample.pdf`);\n```\n\n## Contributors\n\nThis project exists thanks to all the people who contribute. Looking to contribute? Please check our [[contribute]](https:\u002F\u002Fgithub.com\u002Fdiegomura\u002Freact-pdf\u002Fblob\u002Fmaster\u002F.github\u002FCONTRIBUTING.md) document for more details about how to setup a development environment and submitting code.\n\n\u003Ca href=\"https:\u002F\u002Fgithub.com\u002Fdiegomura\u002Freact-pdf\u002Fblob\u002Fmaster\u002F.github\u002FCONTRIBUTING.md\">\u003Cimg src=\"https:\u002F\u002Fopencollective.com\u002Freact-pdf\u002Fcontributors.svg?width=890\" \u002F>\u003C\u002Fa>\n\n## Sponsors\n\nThank you to all our sponsors! [[Become a sponsors](https:\u002F\u002Fopencollective.com\u002Freact-pdf#sponsors)]\n\n\u003Ca href=\"https:\u002F\u002Fopencollective.com\u002Freact-pdf#sponsors\" target=\"_blank\">\u003Cimg src=\"https:\u002F\u002Fopencollective.com\u002Freact-pdf\u002Fsponsors.svg?width=890\">\u003C\u002Fa>\n\n## Backers\n\nThank you to all our backers! [[Become a backer](https:\u002F\u002Fopencollective.com\u002Freact-pdf#backer)]\n\n\u003Ca href=\"https:\u002F\u002Fopencollective.com\u002Freact-pdf#backers\" target=\"_blank\">\u003Cimg src=\"https:\u002F\u002Fopencollective.com\u002Freact-pdf\u002Fbackers.svg?width=890\">\u003C\u002Fa>\n\n## License\n\nMIT © [Diego Muracciole](http:\u002F\u002Fgithub.com\u002Fdiegomura)\n\n---\n\n[![](https:\u002F\u002Fimg.shields.io\u002Fnpm\u002Fdt\u002F@react-pdf\u002Frenderer.svg?style=flat)](https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002F@react-pdf\u002Frenderer)\n","react-pdf 是一个用于在浏览器和服务器端使用 React 创建 PDF 文件的库。它支持通过熟悉的 JSX 语法定义 PDF 内容，利用 Flexbox 布局系统来设计页面样式，使得开发者能够以类似于构建网页的方式创建复杂的 PDF 文档。该库提供了丰富的组件集如 Document、Page、Text 和 View 等，便于用户自定义文档结构与样式，并且可以在 Web 应用中直接渲染预览或在 Node.js 环境下生成 PDF 文件。适用于需要动态生成报告、发票、证书等正式文件的应用场景。","2026-06-11 02:56:32","top_language"]