# image-resizor

> Effortlessly convert, resize, and compress images (jpg, png, heic, heif, webp) into optimized png and jpg formats, all within the browser environment.

Latest version **1.1.3** (published 2024-05-15) · ISC license · 0 weekly downloads

## Install

```sh
npm install image-resizor
pnpm add image-resizor
yarn add image-resizor
bun add image-resizor
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.1.3 |
| Published | 2024-05-15 |
| First published | 2022-05-04 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 3.9 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Jasper Yan |
| Maintainers | namti |
| Keywords | photo, picture, image, bitmap, read, load, resize, resizer, crop, heic, heif, jpg, png, webp, convert, compress, crop, width, height, maxWidth, maxHeight, max, size, scale, aspect, ratio, canvas, reduce |

## Links

- npm: https://www.npmjs.com/package/image-resizor
- npm.io page: https://npm.io/package/image-resizor

## Alternatives

- [exif-parser](https://npm.io/package/exif-parser.md) — 3.8M weekly downloads
- [vite-plugin-compression](https://npm.io/package/vite-plugin-compression.md) — 569.5K weekly downloads
- [pica](https://npm.io/package/pica.md) — 442.4K weekly downloads
- [@reportportal/client-javascript](https://npm.io/package/@reportportal/client-javascript.md) — 408.8K weekly downloads
- [@tldraw/state](https://npm.io/package/@tldraw/state.md) — 316.0K weekly downloads

## Recent versions

- 1.1.3 (latest) — 2024-05-15
- 1.1.2 (alpha) — 2024-05-14
- 1.1.1 — 2024-05-14
- 1.1.0 — 2024-05-13
- 1.0.9 — 2022-05-06
- 1.0.8 — 2022-05-05
- 1.0.7 — 2022-05-05
- 1.0.6 — 2022-05-05
- 1.0.5 — 2022-05-04
- 1.0.4 — 2022-05-04
- 1.0.3 — 2022-05-04
- 1.0.2 — 2022-05-04
- 1.0.1 — 2022-05-04
- 1.0.0 — 2022-05-04

## README

# image-resizor

Effortlessly convert, resize, and compress images (jpg, png, heic, heif, webp) into optimized png and jpg formats, all within the browser environment.

## Demo

[https://namti.github.io/image-resizor](https://namti.github.io/image-resizor)


## Usage

```typescript
import ImageResizor from 'image-resizor';
```
```html
<script src="https://cdn.jsdelivr.net/npm/image-resizor/dist/image-resizor.iife.js"></script>
```

```typescript
new ImageResizor(file, {
  maxWidth: 300,
  maxHeight: 300,
  outputType: 'image/jpeg',
  quality: .8,
})
  .init()
  .then(instance => console.log(instance.toDataURL()))
  .catch(e => console.error(e));
```


## Arguments

```typescript
new ImageResizor(file[, { ...options }])
```

### file

```typescript
File | Blob
```


### options

| Key | Type | Default | Options |
| --- | --- | --- | --- |
| maxWidth | number | 2000 | |
| maxHeight | number | 2000 | |
| scale | number | 1 | 0.1~1 |
| outputType | string | image/png | "image/png" \| "image/jpeg" |
| backgroundColor | string | #ffffff | Background fill for converting images with alpha channel to "image/jpeg" |
| quality | number | 0.9 | 0.1~1 Available if the `outputType` is "image/jpeg" |



## Methods

### toDataURL()
Converts the image into a data URL.

```typescript
instance.toDataURL(): string | undefined
```

### toBlob()
Converts the image into a Blob.

```typescript
instance.toBlob(): Promise<Blob>
```

### getSupportedTypes()

```typescript
enum ImageType {
  jpg = 'image/jpeg',
  jpeg = 'image/jpeg',
  png = 'image/png',
  heic = 'image/heic',
  heif = 'image/heif',
  webp = 'image/webp',
}
static getSupportedTypes(): typeof ImageType 
```

---
_Source: https://npm.io/package/image-resizor · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._