Vue PDF Viewer Starter Toolkit in Electron + Vue 3 + TypeScript

Welcome to the Vue PDF Viewer starter toolkit! This repository demonstrates how to integrate Vue PDF Viewer within an Electron application built on Vue 3 using TypeScript.

Table of Contents

• Usage
  • Project Setup
  • Running the Example Project
  • Using the Vue PDF Viewer Component
• Documentation
• Meta

Usage

Project Setup

1. Clone the Repository

   git clone https://github.com/vue-pdf-viewer/starter-vpv-electron-vue-ts.git
   cd starter-vpv-electron-vue-ts

2. Install Dependencies

   Install the required dependencies using your preferred package manager:

   npm install
   # or
   yarn install
   # or
   pnpm install
   # or
   bun install

   Remark: For pnpm, there is a bit more configuration required which can be found here.

Running the Example Project

This project includes a fully functional Electron + Vue 3 example showcasing Vue PDF Viewer:

1. Start the Development Server

   npm run dev

2. View the App

   The Electron window will launch automatically. You can also open the app in your browser at http://localhost:3000.

---

Using the Vue PDF Viewer Component

Within the Vue 3 app, Vue PDF Viewer is integrated as a Vue 3 component with TypeScript support. To use it:

1. Import the Component

   Example in a page or component:

   <script setup lang="ts">
     import { VPdfViewer } from '@vue-pdf-viewer/viewer';
   </script>

2. Add to Template

   <template>
     <VPdfViewer :src="src" />
   </template>

---

Examples

For more examples, please refer to the src/App.vue file in this repository:

• Default Toolbar
• Without Toolbar
• Mobile View

Remark: If you would like more examples, feel free to open an issue.

For more configurations, please check the documentation site.

---

Meta

• Homepage: https://www.vue-pdf-viewer.dev
• Docs: https://docs.vue-pdf-viewer.dev

---

Thank you for using Vue PDF Viewer with Electron and Vue 3! If you have any questions or run into issues, please open an issue in this repository. Happy coding!