Stack Overflow
Stack Overflow

Questions tagged [react-pdf]

React renderer for creating PDF files on the browser and server

409 questions
5
votes
1 answer

React PDF Viewer library cannot render the first page as soon as the minimum requirement is downloaded

I'm using react-pdf-viewer 3.9.0 with "pdfjs-dist": "2.15.349". It seems like the React PDF Viewer still waits until it completely downloads a file, instead of rendering the first page as soon as the minimum requirement is downloaded (the fast web…
Razi Melliti
  • 170
  • 1
  • 4
  • 18
5
votes
0 answers

@react-pdf-viewer/core ERROR: pdfjs-dist/build/pdf.js: Unexpected character '#' (1413:9)

I am trying to implement pdf viewer using this react-pdf-viewer. But, it keeps throwing this error: /node_modules/pdfjs-dist/build/pdf.js: Unexpected character '#' (1413:9) 1411 | 1412 | class PDFDocumentLoadingTask { 1413 | static #docId =…
AG_HIHI
  • 1,705
  • 5
  • 27
  • 69
5
votes
0 answers

How to add URLs to work as clickable links in react-pdf

I am generating a pdf using react-pdf library. Everything seems to be working fine but I can't make the Link element from @react-pdf/renderer to work properly. const add_hyperlink = (url_text: string) => { return
Aman
  • 61
  • 1
  • 10
5
votes
1 answer

ReactJS react-pdf error "Failed to load PDF file." on some attempts

I created a react js app with create-react-app and I am trying out react-pdf to view pdfs. the problem I have is that my code works sometimes and sometimes doesn't. when I first load the app the pdf always loads well but if i visit other links/urls…
Nelson Thembeni
  • 83
  • 2
  • 8
5
votes
2 answers

React render-pdf open in new page onclick Slow issue

I created one table that has some features every single row can generate a pdf and download by using render-pdf npm, I want to show when the user clicks the download button pdf preview on a new page, it working but the issues rendering in the method…
Noob
  • 136
  • 1
  • 2
  • 17
5
votes
1 answer

react-pdf rendering images from backend url doesn't load images

I am trying to render pdf using react-pdf the issue I am facing is that I am displaying image from the backend server using the URL. But it displays blank in the pdf. When I debugged further came to know that when I put breakpoint on the highlighted…
AnonymousCoder
  • 582
  • 2
  • 5
  • 18
5
votes
2 answers

Render custom HTML markup inside pdf document using react-pdf/render library

I am trying to render HTML inside the / component while rendering the PDF inside the using a Template. I'd like to render my custom HTML Markup code shown below in my pdf

Pre Interview…

arjun bollam
  • 127
  • 1
  • 10
5
votes
1 answer

Failed to load PDF file in React js

I am on working on a simple react web app that adds and retrieves files to/from IPFS. When a file is added to IPFS, the name of the added file (i.e Medical file) as well as a "View file " button will appear on the page. When the button is clicked,…
Mo Mo
  • 79
  • 1
  • 2
  • 7
5
votes
2 answers

How to use react-pdf library with Typescript

I'm trying to use a npm library that help me to render a pdf document. I found react-pdf but it doesn't have the types for TypeScript yet, so I'm using it as I show below: let Document = require('react-pdf'); let Page = require('react-pdf'); class…
ocuenca
  • 38,548
  • 11
  • 89
  • 102
4
votes
3 answers

"react-pdf" displaying text found inside the PDF instead of the PDF itself?

https://www.npmjs.com/package/react-pdf I'm using this package to try to display a PDF file. This is the PDF i'm currently displaying: https://i.stack.imgur.com/uF4ER.png and as you can see in this…
Eric Andre
  • 204
  • 2
  • 9
4
votes
2 answers

Getting error when displaying a PDF file using react-pdf

I integrated the file uploader from the base UI and tried to display the uploaded file using react-pdf package. I tried converting the file as Blob and then uploaded it with the below code const test = new Blob([file], { type: "application/pdf" }); …
Abhinav Veramosu
  • 43
  • 1
  • 4
4
votes
4 answers

I can't modify webpack.config in create-react-app to install react-pdf

Help me install the react-pdf package (https://github.com/diegomura/react-pdf) on create react app. I can't make changes to webpack.config. I do it according to the instructions I found here from the user River Twilight: How to update webpack config…
Schekhovtsov
  • 101
  • 2
  • 10
4
votes
0 answers

Attempted import error: 'Picker' is not exported from 'selderee'. while using html-to-text npm package in React app

Attempted import error: 'Picker' is not exported from 'selderee'. I got this error while I trying to convert html tags to text in the frontend. My code is given below. Please help me to get rid of this error. import { convert } from…
Shahid
  • 129
  • 10
4
votes
2 answers

How to use Custom font for @react-pdf/renderer

I'm trying to use my custom font for creating a pdf file using @react-pdf/renderer. Here is my code: const styles = StyleSheet.create({ page: { alignItems: "center", }, text: { fontFamily: "Nunito", }, }); const MainPage = () => { …
Hamid
  • 503
  • 6
  • 22
4
votes
2 answers

How do I get the page count from a PDF file with react-pdf?

So far, using react-pdf has been simple, but I'm missing a crucial piece that I don't know how to find. I'm trying to get the total number of pages of a PDF document on load. I need this to create a page number navigation. Clearly the data exists…
Pleasant Nightmares
  • 179
  • 3
  • 12
1 2
3
…
27 28