Package Exports
- @react-pdf/renderer
- @react-pdf/renderer/lib/react-pdf.browser.cjs.js
- @react-pdf/renderer/lib/react-pdf.browser.es.js
- @react-pdf/renderer/lib/react-pdf.cjs.js
- @react-pdf/renderer/lib/react-pdf.es.js
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@react-pdf/renderer) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
React renderer for creating PDF files on the browser and server
How to install
yarn add @react-pdf/rendererHow it works
import React from 'react';
import { 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 = () => (
<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>
);Web. Render in DOM
import React from 'react';
import ReactDOM from 'react-dom';
import { PDFViewer } from '@react-pdf/renderer';
const App = () => (
<PDFViewer>
<MyDocument />
</PDFViewer>
);
ReactDOM.render(<App />, document.getElementById('root'));Node. Save in a file
import React from 'react';
import ReactPDF from '@react-pdf/renderer';
ReactPDF.render(<MyDocument />, `${__dirname}/example.pdf`);Examples
For each example, try opening output.pdf to see the result.
Text |
Resume |
Fractals |
Knobs |
Page wrap |
Contributors
This project exists thanks to all the people who contribute. [Contribute].
Sponsors
Thank you to all our sponsors! [Become a sponsors]
Backers
Thank you to all our backers! [Become a backer]
License
MIT © Diego Muracciole
