@react-pdf/renderer NPM | npm.io

4.3.0 • Published 8 months ago

Install

Weekly downloads

94,173

License

MIT

Repository

Last release

8 months ago

How to install

yarn add @react-pdf/renderer

How it works

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 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 ReactPDF from '@react-pdf/renderer';

ReactPDF.render(<MyDocument />, `${__dirname}/example.pdf`);

Examples

For each example, try opening output.pdf to see the result.

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

npm.io

@babel/runtime @react-pdf/fns @react-pdf/font @react-pdf/layout @react-pdf/pdfkit @react-pdf/primitives @react-pdf/reconciler @react-pdf/render @react-pdf/types events object-assign prop-types queue

@pubngo-stack/reservation-api-browser scandinavia abc-institute @upandgo/micro-learning @amosah/resume @infinitebrahmanuniverse/nolb-_react-p gbc-test-2 test-pdf-lib-resumify @everything-registry/sub-chunk-766 @renewvate/ren-dashboard-views @renewvate/views @ascendware/mx casting-shared-ui-components pdf-generator-xxxxx wood-deck-demo the-handsomestnerd-internal app-admin karimaaitbba kakemono jumbito-standalone jumbito-standalone2 jumbito-standalone3 lcdp-ui-controls lcdp-ui-upates lcdp-ui-updates lam-mvt identity-admin incard-pdf-generator gw-request-ui inyad-design-system-k interpos-web-client invoice-generator-educational-purpose invoice-generator-v1 list-table-component library-documents-tc-test mann-components mars-antech kimi-theme medfro-print-templates medusa-plugin-resend-react @windesk/windeskui @wings-dev/components @ulld/pdf @trackmatic/yard-ui-common @upandgo/micro-learning-generator @upandgo/micro-learning-plateform alpha-react-portfolio adac-ui-components ai-coach-assistance_web advanced-modules advanced-modules-mfg alta-react-component alta-react-frontend atlas-jupyter-react asset_monitoring_app_server @grupo-brik/colpass-components @grupo-brik/propio-components @groceristar/cards-wrapper @groceristar/pdf-export wd-mili-documents jvsilvawtecminimal-kit mylibka qafto-website-preview qaftoplaygroundnew summit-registration-lite summit-schedule-app sompo-theme-style-npm ui-test-rowflex zccomponents-react @lapidist/cv-generator @lorren-js/core @lettvet/pdf @lincolnteste/components mrsimply-pdf model-explorer model-navigator-standalone mm-pdf orgzapp-common-utility-module one-to-one-spfx open-resume pedeffy pedilo-landing pdf-config pdf-courriers pdf-report-table paperworker pbn-voip-modules sern-stack rc-tri-events-merchant react-bumps-chart rpr-flextable react-boilerplate-typescript robodog robodogcli robodoglib react-antdesign-boilerplate saas-code-profile sendforsign neoma nextwromo-store

12 months ago

12 months ago

8 months ago

8 months ago

9 months ago

8 months ago

9 months ago

9 months ago

12 months ago

12 months ago

11 months ago

12 months ago

12 months ago

12 months ago

12 months ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

5 years ago

5 years ago

5 years ago

5 years ago

4 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago