Questions tagged [react-pdf-viewer]
27 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
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
1 answer
SyntaxError: Unexpected token '||='
I need to build nextjs project with PDFViewer using @react-pdf-viewer, but when collecting page there are some error SyntaxError: Unexpected token '||='.
The problem is occured from pdf.js in node_modules, I try to change ||= to || in pdf.js, and…
Orlando
- 78
- 6
2
votes
1 answer
React-pdf Missing class properties transform
I'm trying to display a pdf file on a web page with React.
The problem I have is that after installing react-pdf and importing import { DOCUMENT } from 'react-pdf' the project doesn't compile, showing the following…
Marco Espinoza
- 31
- 4
1
vote
0 answers
React-pdf-viewer warnings
When the application is started these console messages appear.
Warning: getHexString - ignoring invalid character: 33.
Warning: getHexString - ignoring additional invalid characters.
Warning: Indexing all PDF objects.
Is there any way to remove…
Maximiliano Delfino
- 11
- 3
1
vote
0 answers
How to use react-pdf annotation?
I am loading pdf by react-pdf. I have two buttons Title and Author. When the user clicks on the title button, the background of the title will change, then click on the author, and it will change all author's name background colors of the pdf…
KAMRUL HASAN
- 45
- 1
- 7
1
vote
0 answers
whenever select the multiple files through input type file then print the filename and number of pages present in file using React-pdf
I just want to display multiple filenames and the number of pages present in a particular file. for the number of pages, I'm using the react-pdf library
I'm only able to display file names but didn't able to demonstrate/show pdf files when I…
Deepak Singh
- 749
- 4
- 16
1
vote
2 answers
I am trying to integrate @react-pdf/renderer in my proyect and I get this error: "Uncaught TypeError: module.runSetters is not a function"
When I try to integrate @react-pdf/renderer into my project, it gives me the next error
"Uncaught TypeError: module.runSetters is not a function"
Error:
My code:
import React from "react";
import {
Page,
Text,
View,
Document,
} from…
React
- 57
- 7
1
vote
0 answers
zlibWEBPACK_IMPORTED_MODULE_3.createDeflate is not a function while renderin react-pdf component
I'm using react pdf to render my component as PDF & allow user to download that PDF on button the PDF was working well after applying pollyfills changes but for my lead (who is using MAC) the PDF was not rendering and giving the
Error:…
Hasham Minhas
- 61
- 6
1
vote
2 answers
React component doesn't rerender based onprops change
I have pdf-viewer component
export default function PDFViewer({keyword}) {
const searchPluginInstance = searchPlugin({
keyword,
})
const {Search} = searchPluginInstance;
return (
margherita pizza
- 6,623
- 23
- 84
- 152
0
votes
0 answers
"canvas.node" Error During Installation of react-pdf-viewer Package with Next.js and TypeScript
I'm trying to integrate the "react-pdf-viewer" package into a Next.js project using TypeScript, but I'm encountering an issue during installation. I downloaded the package via npm and followed the steps in the documentation. However, when I compile…
hakan korkmaz
- 1
- 1
- 2
0
votes
0 answers
How to highlight a specific line whole pdf
How to highlight nth line. For example I want to highlight the 100th line of whole pdf, how can I achieve that. Another thing is that I want to highlight a whole line with single click. For example if I click on a word on the 15th line I want the…
Towhid.kahn
- 1
- 1
- 1
0
votes
1 answer
How to highlight the pdf page text based upon the line number in reactjs
This is the data, based upon the metadata I need to use to highlight the text:
const data = {
text: "The requirements include...",
sourceDocuments: [
{
pageContent:"Functionality requirements, backend functionality\nUser data…
Venkatesh
- 58
- 8
0
votes
0 answers
Is it possible to adjust '@react-pdf-viewer/core' viewer height based on limited number of rendered pages?
I have an issue while using '@react-pdf-viewer/core'..
Is there any methods to make the height of the viewer dynamic after setRenderRange the pdf?
Please allow me to use this image to explain.. =)
enter image description here
So no. 1 is, where the…
Ronny Setiawan
- 1
- 2