image-resizor
TypeScript icon, indicating that this package has built-in type declarations

1.1.3 • Public • Published

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

Usage

import ImageResizor from 'image-resizor';
<script src="https://cdn.jsdelivr.net/npm/image-resizor/dist/image-resizor.iife.js"></script>
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

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

file

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.

instance.toDataURL(): string | undefined

toBlob()

Converts the image into a Blob.

instance.toBlob(): Promise<Blob>

getSupportedTypes()

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

Package Sidebar

Install

npm i image-resizor

Weekly Downloads

100

Version

1.1.3

License

ISC

Unpacked Size

4.09 MB

Total Files

7

Last publish

Collaborators

  • namti