TypeScript icon, indicating that this package has built-in type declarations

1.0.0 • Public • Published

PDF Reader

Project forked from xcarpentier rn-pdf-reader-js to support recent dependencies

Android support 🚀

npm version npm downloads

Read a PDF just with JS (no native libs needed)


  • 👉Install react-native-webview on your own!
  • 👉Install expo-file-system on your own!
  • 👉Install expo-constants on your own!
  • Use it into Expo app (from expo client, Standalone app or ExpoKit app).
  • Only React-Native 0.59-0.60+ support, Expo SDK 33-44+

PRs are welcome...


import * as React from 'react'
import { View } from 'react-native'
import PDFReader from 'rn-pdf-reader-js'

export default class App extends React.Component {
    render() {
        return (
                    uri: 'http://gahp.net/wp-content/uploads/2017/09/sample.pdf',

See more detailed example into App.tsx file.


interface Source {
    uri?: string // can be local or served on the web (ie. start with `https://` or `file://`)
    base64?: string // should start with `data:application/pdf;base64,`. A base64 encoded pdf file tends to start with `JVBERi0xL` so your complete string should look something like this: `data:application/pdf;base64,JVBERi0xL...`
    headers?: { [key: string]: string }

interface Props {
    source: Source
    style?: View['props']['style'] // style props to override default container style
    webviewStyle?: WebView['props']['style'] // style props to override default WebView style
    webviewProps?: WebView['props']
    noLoader?: boolean
    useGoogleReader?: boolean // If you are not worried about confidentiality
    withScroll?: boolean // Can cause performance issue
    withPinchZoom?: boolean
    customStyle?: {
        readerContainer?: CSS.Properties
        readerContainerDocument?: CSS.Properties
        readerContainerNumbers?: CSS.Properties
        readerContainerNumbersContent?: CSS.Properties
        readerContainerZoomContainer?: CSS.Properties
        readerContainerZoomContainerButton?: CSS.Properties
        readerContainerNavigate?: CSS.Properties
        readerContainerNavigateArrow?: CSS.Properties
    onLoad?(): void // callback that runs after WebView is loaded
    onLoadEnd?(): void // callback that runs after WebView is loaded
    onError?(): void // callback that runs when WebView is on error


Render type Platform Source prop
Custom PDF reader Android uri or base64
Direct from WebView iOS uri or base64
Google PDF Reader Android, iOS uri

What rn-pdf-reader-js use?

  • react-pdf (pdf.js)
  • WebView
  • Base64


Hire an expert!

Looking for a ReactNative freelance expert with more than 12 years experience? Contact me from my website!

Package Sidebar


npm i rn-pdf-reader-js-improved

Weekly Downloads






Unpacked Size

120 kB

Total Files


Last publish


  • renishv8