Scale & Stretch Image On The Client Side – skaler

skaler is a lightweight client-side image resize library that allows the user to scales down/up or stretches images to a specific size.

Ideal for the file uploader that can be used to resize the image before uploading.

How to use it:

Install & import the skaler.

# NPM
$ npm install skaler --save

// ES 6
import skaler from 'skaler';
// CommonJS:
const skaler = require('skaler');

Or load the UMD version of the skaler from a CDN.

<script src="https://unpkg.com/skaler"></script>

Scale down the image to 200px width.

const file = await skaler(imageFile, { 
      width: 200
});

Scale up to 900px width.

const file = await skaler(imageFile, { 
      width: 900
});

Scale to 0.5 percent.

const file = await skaler(imageFile, { 
      scale: 0.5
});

Stretch to 150x150px.

const file = await skaler(imageFile, { 
      width: 150, 
      height: 150
});