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-file-picker`
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/file-picker/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:
npx 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-file-picker` plugin in my project.Si prefieres la configuración manual, instala el plugin ejecutando estos comandos y sigue las instrucciones de cada plataforma:
npm install @capgo/capacitor-file-pickernpx cap syncImportar
Sección titulada “Importar”import { CapgoFilePicker } from '@capgo/capacitor-file-picker';Inicio rápido
Sección titulada “Inicio rápido”import { CapgoFilePicker } from '@capgo/capacitor-file-picker';
const result = await CapgoFilePicker.pickFiles({ types: ['application/pdf', 'image/*'], limit: 5, readData: false});console.log('Picked files:', result.files);Ejemplo: pickImages
Sección titulada “Ejemplo: pickImages”import { CapgoFilePicker } from '@capgo/capacitor-file-picker';
const result = await CapgoFilePicker.pickImages({ limit: 10, readData: false});console.log('Picked images:', result.files);Ejemplo: pickVideos
Sección titulada “Ejemplo: pickVideos”import { CapgoFilePicker } from '@capgo/capacitor-file-picker';
const result = await CapgoFilePicker.pickVideos({ limit: 3, skipTranscoding: true});console.log('Picked videos:', result.files);Errores comunes
Sección titulada “Errores comunes”- Permisos: llama a
checkPermissions()luegorequestPermissions()cuando sea necesario. - Listeners: elimina los handles cuando se desmonten las pantallas.
- Fuente de verdad: confianza
src/definitions.tsen el repo de GitHub.
Resumen de API
Sección titulada “Resumen de API”pickFiles
Sección titulada “pickFiles”Selecciona uno o más archivos del dispositivo.
import { CapgoFilePicker } from '@capgo/capacitor-file-picker';
const result = await CapgoFilePicker.pickFiles({ types: ['application/pdf', 'image/*'], limit: 5, readData: false});console.log('Picked files:', result.files);pickImages
Sección titulada “pickImages”Selecciona una o varias imágenes de la galería. Solo Android/iOS.
import { CapgoFilePicker } from '@capgo/capacitor-file-picker';
const result = await CapgoFilePicker.pickImages({ limit: 10, readData: false});console.log('Picked images:', result.files);pickVideos
Sección titulada “pickVideos”Selecciona uno o varios vídeos de la galería. Solo Android/iOS.
import { CapgoFilePicker } from '@capgo/capacitor-file-picker';
const result = await CapgoFilePicker.pickVideos({ limit: 3, skipTranscoding: true});console.log('Picked videos:', result.files);pickMedia
Sección titulada “pickMedia”Selecciona una o varias imágenes o vídeos de la galería. Solo Android/iOS.
import { CapgoFilePicker } from '@capgo/capacitor-file-picker';
const result = await CapgoFilePicker.pickMedia({ limit: 5, readData: true});console.log('Picked media:', result.files);pickDirectory
Sección titulada “pickDirectory”Selecciona un directorio del dispositivo. Solo Android/iOS.
import { CapgoFilePicker } from '@capgo/capacitor-file-picker';
const result = await CapgoFilePicker.pickDirectory();console.log('Selected directory:', result.path);convertHeicToJpeg
Sección titulada “convertHeicToJpeg”Convierte una imagen HEIC al formato JPEG. Solo iOS.
import { CapgoFilePicker } from '@capgo/capacitor-file-picker';
const result = await CapgoFilePicker.convertHeicToJpeg({ path: '/path/to/image.heic', quality: 0.9});console.log('Converted file:', result.path);copyFile
Sección titulada “copyFile”Copia un archivo a otra ubicación.
import { CapgoFilePicker } from '@capgo/capacitor-file-picker';
await CapgoFilePicker.copyFile({ from: '/source/file.pdf', to: '/destination/file.pdf', overwrite: true});checkPermissions
Sección titulada “checkPermissions”Comprueba los permisos para leer archivos. Solo Android.
import { CapgoFilePicker } from '@capgo/capacitor-file-picker';
const status = await CapgoFilePicker.checkPermissions();console.log('Read permission:', status.readExternalStorage);requestPermissions
Sección titulada “requestPermissions”Solicita permisos para leer archivos. Solo Android.
import { CapgoFilePicker } from '@capgo/capacitor-file-picker';
const status = await CapgoFilePicker.requestPermissions();if (status.readExternalStorage === 'granted') { console.log('Permission granted');}Referencia de tipos
Sección titulada “Referencia de tipos”PickFilesOptions
Sección titulada “PickFilesOptions”Opciones para seleccionar archivos.
export interface PickFilesOptions { /** * List of accepted MIME types or file extensions. * On iOS, only MIME types are supported. * Examples: ['image/*'], ['application/pdf'], ['.pdf', '.doc'] */ types?: string[]; /** * Maximum number of files to pick. * Set to 0 for unlimited (platform default). * @default 0 */ limit?: number; /** * Whether to read the file data as base64. * Note: Reading large files may cause memory issues. * @default false */ readData?: boolean;}PickFilesResult
Sección titulada “PickFilesResult”Resultado de la selección de archivos.
export interface PickFilesResult { /** Array of picked files */ files: PickedFile[];}PickMediaOptions
Sección titulada “PickMediaOptions”Opciones para seleccionar multimedia (imágenes/videos).
export interface PickMediaOptions { /** * Maximum number of files to pick. * Set to 0 for unlimited (platform default). * @default 0 */ limit?: number; /** * Whether to read the file data as base64. * Note: Reading large files may cause memory issues. * @default false */ readData?: boolean; /** * iOS only: Skip transcoding of videos. * @default false */ skipTranscoding?: boolean; /** * iOS 15+ only: Show ordered selection badges. * @default false */ ordered?: boolean;}PickDirectoryResult
Sección titulada “PickDirectoryResult”Resultado de la selección de un directorio.
export interface PickDirectoryResult { /** The path to the selected directory */ path: string;}ConvertHeicToJpegOptions
Sección titulada “ConvertHeicToJpegOptions”Opciones para convertir HEIC a JPEG.
export interface ConvertHeicToJpegOptions { /** The path to the HEIC file to convert */ path: string; /** * The compression quality for JPEG (0.0 - 1.0). * @default 0.9 */ quality?: number;}ConvertHeicToJpegResult
Sección titulada “ConvertHeicToJpegResult”Resultado de la conversión de HEIC a JPEG.
export interface ConvertHeicToJpegResult { /** The path to the converted JPEG file */ path: string;}CopyFileOptions
Sección titulada “CopyFileOptions”Opciones para copiar un archivo.
export interface CopyFileOptions { /** Source file path */ from: string; /** Destination file path */ to: string; /** * Whether to overwrite if destination exists. * @default false */ overwrite?: boolean;}PermissionStatus
Sección titulada “PermissionStatus”Estado del permiso para el acceso a archivos.
export interface PermissionStatus { /** Whether permission to read media files is granted */ readExternalStorage: PermissionState; /** Whether permission to access media location is granted */ accessMediaLocation?: PermissionState;}PickerDismissedListener
Sección titulada “PickerDismissedListener”Callback del listener para el evento de cierre del picker.
export type PickerDismissedListener = (event: null) => void;PickedFile
Sección titulada “PickedFile”Representa un archivo seleccionado.
export interface PickedFile { /** The name of the file */ name: string; /** The path to the file */ path?: string; /** The MIME type of the file */ mimeType: string; /** The size of the file in bytes */ size: number; /** * The base64 encoded data of the file. * Only present if readData was true. */ data?: string; /** * The Blob instance of the file. * Web only. */ blob?: Blob; /** Width in pixels (images/videos only) */ width?: number; /** Height in pixels (images/videos only) */ height?: number; /** Duration in seconds (videos only) */ duration?: number; /** Last modified timestamp in milliseconds */ modifiedAt?: number;}PermissionState
Sección titulada “PermissionState”Valores del estado del permiso.
export type PermissionState = 'prompt' | 'prompt-with-rationale' | 'granted' | 'denied';Fuente de verdad
Sección titulada “Fuente de verdad”Esta página se genera a partir del plugin src/definitions.ts. Vuelve a ejecutar el sync cuando el API público cambie en upstream.
Continúa desde Getting Started
Sección titulada “Continúa desde Primeros pasos”Si estás usando Primeros pasos para planificar el almacenamiento y la gestión de archivos, conéctalo con Uso de @capgo/capacitor-file-picker para la capacidad nativa en Uso de @capgo/capacitor-file-picker, @capgo/capacitor-data-storage-sqlite para el detalle de implementación en @capgo/capacitor-data-storage-sqlite, Uso de @capgo/capacitor-data-storage-sqlite para la funcionalidad nativa en Uso de @capgo/capacitor-data-storage-sqlite, @capgo/capacitor-file para el detalle de implementación en @capgo/capacitor-file, y Uso de @capgo/capacitor-file para la funcionalidad nativa en Uso de @capgo/capacitor-file.