Skip to main content

File Compressor Capacitor plugin

Capacitor plugin for efficient image compression supporting PNG, JPEG, and WebP formats across iOS, Android, and Web platforms

Install

bun add @capgo/capacitor-file-compressor bunx cap sync
npm, pnpm or yarn
  • npm install @capgo/capacitor-file-compressor
  • pnpm add @capgo/capacitor-file-compressor
  • yarn add @capgo/capacitor-file-compressor

Guide

How to use File Compressor in Capacitor

Test on device

Download the Capgo app, then scan the QR code.

File Compressor plugin preview QR code

Using @capgo/capacitor-file-compressor

Capacitor File Compressor Plugin interface for image compression.

Install

bun add @capgo/capacitor-file-compressor
bunx cap sync

bunx cap sync copies the plugin's native code into your native projects. Run it again after every plugin upgrade.

Import

import { FileCompressor } from '@capgo/capacitor-file-compressor';

API at a glance

Method Description
compressImage Compresses an image file with specified dimensions and quality settings.

Examples

compressImage()

Compresses an image file with specified dimensions and quality settings.

import { FileCompressor } from '@capgo/capacitor-file-compressor';

// Web - Compress from file input
const fileInput = document.getElementById('file') as HTMLInputElement;
const file = fileInput.files[0];
const result = await FileCompressor.compressImage({
  blob: file,
  quality: 0.8,
  width: 1200,
  mimeType: 'image/jpeg'
});
const url = URL.createObjectURL(result.blob);

Full reference

Keep going from Using @capgo/capacitor-file-compressor

If you are using Using @capgo/capacitor-file-compressor to plan storage and file handling, connect it with @capgo/capacitor-file-compressor for the implementation detail in @capgo/capacitor-file-compressor, Getting Started for the implementation detail in Getting Started, @capgo/capacitor-data-storage-sqlite for the implementation detail in @capgo/capacitor-data-storage-sqlite, Using @capgo/capacitor-data-storage-sqlite for the native capability in Using @capgo/capacitor-data-storage-sqlite, and @capgo/capacitor-file for the implementation detail in @capgo/capacitor-file.

FAQ

File Compressor plugin FAQ

How do I install the File Compressor plugin in a Capacitor app?

Run "bun add @capgo/capacitor-file-compressor" (or "npm install @capgo/capacitor-file-compressor"), then run "bunx cap sync" so the iOS and Android projects pick up the native code. Import it from "@capgo/capacitor-file-compressor" in your app code.

Does @capgo/capacitor-file-compressor work with React, Vue and Angular?

Yes. File Compressor is a Capacitor package, so it works with any web framework that runs inside Capacitor, including Ionic, React, Vue, Angular, Svelte and plain JavaScript.

Which Capacitor version does @capgo/capacitor-file-compressor support?

Capgo plugins follow Capacitor's major version: use the plugin major version that matches your Capacitor major version (for example plugin v8 with Capacitor 8). The compatibility table in the GitHub README lists the maintained versions.

Is @capgo/capacitor-file-compressor free and open source?

Yes. The source code is public on GitHub at https://github.com/Cap-go/capacitor-file-compressor/ and the package is free to install from npm. Bug reports and pull requests are welcome.

Can I update code that uses File Compressor without an App Store review?

Installing or upgrading the plugin changes native code, so it needs a new store build. After that, JavaScript, HTML and CSS changes that call the plugin can ship instantly with Capgo live updates.

Ship File Compressor changes without waiting for app review

Once the plugin is in your store build, Capgo live updates push your JavaScript, HTML and CSS changes to users in minutes.

Start with Capgo