Primeros pasos
Copia un prompt de configuración con los pasos de instalación y la guía completa en markdown para este plugin.
Set up this Capacitor plugin in the project.
Use the package manager already used by the project.
Install these package(s): `@capgo/capacitor-pdf-viewer`
Run the required Capacitor sync/update step after installation.
Read this markdown guide for the full setup steps: https://raw.githubusercontent.com/Cap-go/website/refs/heads/main/apps/docs/src/content/docs/docs/plugins/pdf-viewer/getting-started.mdx
Use that guide for platform-specific steps, native file edits, permissions, config changes, imports, and usage setup.
If that guide references other docs pages, read them too.
Instalar
Sección titulada “Instalación”Puedes usar nuestro setup asistido por IA para instalar el plugin. Añade las skills de Capgo a tu herramienta de IA con el siguiente comando:
bunx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-pluginsLuego usa el siguiente prompt:
Use the `capacitor-plugins` skill from `Cap-go/capgo-skills` to install the `@capgo/capacitor-pdf-viewer` plugin in my project.Si prefieres la configuración manual, instala el plugin ejecutando estos comandos y sigue las instrucciones de cada plataforma:
bun add @capgo/capacitor-pdf-viewerbunx cap syncImportar
Sección titulada “Importar”import { PdfViewer } from '@capgo/capacitor-pdf-viewer';Inicio rápido
Sección titulada “Inicio rápido”import { PdfViewer } from '@capgo/capacitor-pdf-viewer';
const result = await PdfViewer.open({ source: 'https://example.com/manual.pdf', headers: { Authorization: 'Bearer token' }, mode: 'fullscreen',});Errores comunes
Sección titulada “Errores comunes”- Listeners: elimina los handles cuando se desmonten las pantallas.
- Sync nativo: ejecuta
bunx cap synctras actualizar los plugins. - Fuente de verdad: confianza
src/definitions.tsen el repo de GitHub.
Configuración de la plataforma
Sección titulada “Configuración de la plataforma”- Configurar iOS (PDFKit, sin claves plist adicionales).
- Configuración de Android (Pdfium,
INTERNETpara fuentes HTTPS). - underWebView para un PDF nativo detrás de un WebView transparente con un marco HTML personalizado (iOS y Android).
import { PdfViewer } from '@capgo/capacitor-pdf-viewer';
await PdfViewer.addListener('pageChange', ({ page, pageCount }) => { console.log(`Page ${page} of ${pageCount}`);});
const { pageCount } = await PdfViewer.open({ source: 'https://example.com/manual.pdf', headers: { Authorization: 'Bearer YOUR_TOKEN' }, mode: 'fullscreen', scrollMode: 'continuous', page: 1,});
console.log(`Opened ${pageCount} pages`);// Call PdfViewer.close() when the user dismisses the viewer or you navigate away.