Getting started

Minimum requirements

React PDF Viewer is powered by React hooks completely. So it requires React 16.8 or later.
If you are using TypeScript, then it requires TypeScript 3.8 or later.
The TypeScript definition files of `@react-pdf-viewer` packages use `export type` syntax which is only available from TypeScript 3.8.

Installing packages

1. Installing pdfjs library
React PDF Viewer uses the APIs provided by the popular pdfjs library. Execute the following command from the root folder to install pdfjs:
npm install pdfjs-dist@3.4.120
The `pdfjs-dist` will be added to the `dependencies` section in `package.json`:
{
"dependencies": {
"pdfjs-dist": "^3.4.120"
}
}

Problem with installation on Apple M1

If the installed version of `pdfjs-dist` requires the canvas package which has issues with Apple M1. You can fix it by installing the canvas dependencies manually.
The following lines show how to do it with Brew, a popular packages manager for macOS:
$ brew install pkg-config cairo pango

Using the latest version of pdfjs-dist

The latest version of `pdfjs-dist` (`3.4.120`) uses some modern JavaScript features. It requires additional configurations. If you use one of the following starters, please take a look at the sample project for more details.
StarterDescription
Create React AppUse with Create React App
ElectronUse with Electron
GatsbyJSUse with GatsbyJS
NextJSUse with NextJS
ParcelBundle with Parcel
RescriptsUse with Rescripts
SnowpackBundle with Snowpack
WebpackBundle with Webpack
Webpack + TypeScriptBundle with Webpack, TypeScript
2. Installing the core package
npm install @react-pdf-viewer/core@3.12.0