Skip to content
A high performance react native library to preview document files, support AIrPrint
Branch: master
Clone or download
Type Name Latest commit message Commit time
Failed to load latest commit information.

React Native iOS npm version License: MIT

react-native-file-preview is a simple library to preview files. It's written in native code, support iOS platform (using WKWebView).

  • Features:
    • iOS 9.0+, iPhone and iPad devices
    • Most popular document types (xlsx, pptx, docx, images, pdf, html, etc...)
    • Zoom in/out using gestures
    • Support network resources (https://) and local resources (file://)
    • Support large files, better performance compared to QuickLook implementation
    • Support AirPrint


import FilePreview from 'react-native-file-preview';



The package can be added via npm or yarn:

$ yarn add react-native-file-preview

Link the packge

$ react-native link react-native-file-preview

Post link steps

After the link you'll need two extra steps to make it working. It's simple to configure them using XCode:

Step 1. Copy the image resouces

  1. Click the project name in XCode Project navigator, choose your project name in the TARGETS sestion (to the right or the Project navigator).
  2. Click Build Phases, click Copy Bundle Resources.
  3. Drag the RNFilePreviewBundle.bundle file (under Project Navagator - Libraries - RNFilePreview.xcodeproj) to Copy Bundle Resources.

Step 2. Add the Swift bridging header (skip this step if you already use Swift in your iOS project)

  1. Right click the souce code folder (the yellow folder contains AppDelegate.m) in the Project navigator (the left panel in XCode).
  2. Select New File, choose iOS - Source - Swift file, choose Create.
  3. XCode will popup a dialog asking "Would you like to configure an Objective-C bridging header?". Choose Create Bridging Header.



FilePreviewHelper.showPreview(path, showPrintButton)

FilePreviewHelper.showPreview(path, showPrintButton, showBlackStatusBar)

  • path: string

  • showPrintButton: boolean

    • should the preview page show the AirPrint button
    • default value is true
  • showBlackStatusBar: boolean

    • should the preview page show the status bar in balck
    • default value is true
You can’t perform that action at this time.