# vue-pdf-embed: A Robust PDF Embed Component for Vue 2 and Vue 3

This repository profile is provided by osrepos.com, an open source repository discovery platform.

Source: osrepos.com
Repository profile: https://osrepos.com/repo/hrynko-vue-pdf-embed
Generated for open source discovery and AI-assisted research.

vue-pdf-embed is a powerful and easy-to-use PDF embed component designed for Vue applications. It supports both Vue 2 and Vue 3, offering features like password-protected document handling, text and annotation layers, and no external peer dependencies. This component simplifies the integration of PDF viewing directly into your web projects.

GitHub: https://github.com/hrynko/vue-pdf-embed
OSRepos URL: https://osrepos.com/repo/hrynko-vue-pdf-embed

## Summary

vue-pdf-embed is a powerful and easy-to-use PDF embed component designed for Vue applications. It supports both Vue 2 and Vue 3, offering features like password-protected document handling, text and annotation layers, and no external peer dependencies. This component simplifies the integration of PDF viewing directly into your web projects.

## Topics

- pdf
- vue
- typescript
- frontend
- component
- web-development

## Repository Information

Last analyzed by OSRepos: Sat Jun 20 2026 17:22:29 GMT+0100 (Western European Summer Time)
Detail views: 4
GitHub clicks: 1

## Safety Notice

OSRepos shares public repositories for knowledge and discovery only. Review source code, dependencies, licenses, and security implications before running or installing anything.

## Content

## Introduction

vue-pdf-embed is a versatile PDF embed component designed for Vue.js applications. It allows developers to easily display PDF documents directly within their Vue 2 and Vue 3 projects, providing a seamless user experience. This component stands out for its robust feature set, including controlled rendering of PDF documents, handling of password-protected files, and support for interactive text and annotation layers, making documents searchable and selectable. Built with TypeScript, vue-pdf-embed offers a reliable and type-safe solution for integrating PDF viewing capabilities.

## Installation

Getting started with vue-pdf-embed is straightforward. You can install the package using npm or yarn, or include it directly via a script tag in your HTML.

shell
npm install vue-pdf-embed


shell
yarn add vue-pdf-embed


For direct browser usage, include the script:

html
<script src="https://unpkg.com/vue-pdf-embed"></script>


## Examples

Integrating vue-pdf-embed into your Vue application is simple. Here is a basic usage example:

vue
<script setup>
import VuePdfEmbed from 'vue-pdf-embed'

// Optional styles
import 'vue-pdf-embed/dist/styles/annotationLayer.css'
import 'vue-pdf-embed/dist/styles/textLayer.css'

// Either URL, Base64, binary, or document proxy
const pdfSource = '<PDF_URL>'
</script>

<template>
  <VuePdfEmbed annotation-layer text-layer :source="pdfSource" />
</template>


For more advanced scenarios and live demonstrations, explore the official JSFiddle examples:
*   [Basic Usage Demo](https://jsfiddle.net/hrynko/atcn32yp)
*   [Advanced Usage Demo](https://jsfiddle.net/hrynko/273a59qr)
*   [Lazy Loading Demo](https://jsfiddle.net/hrynko/u149my7h)

## Why Use vue-pdf-embed?

vue-pdf-embed simplifies the complex task of embedding PDF documents into Vue applications. Its key advantages include:

*   **Comprehensive Features**: It supports essential functionalities like text selection, annotations, and password protection right out of the box, enhancing user interaction with PDF content.
*   **Ease of Use**: With no complex peer dependencies or additional configuration required, setup is quick and hassle-free.
*   **Vue 2 and Vue 3 Compatibility**: The component is designed to work seamlessly across both major versions of Vue, ensuring broad applicability.
*   **Controlled Rendering**: Developers have fine-grained control over document rendering, including specific pages, rotation, and scaling.
*   **Public Methods**: It provides convenient public methods for downloading and printing documents directly from the component instance.

## Links

*   **GitHub Repository**: [hrynko/vue-pdf-embed](https://github.com/hrynko/vue-pdf-embed)
*   **npm Package**: [vue-pdf-embed](https://npmjs.com/package/vue-pdf-embed)