frontend-image-compress
compress image-type file in frontend using canvas
Last updated 7 months ago by xhmm .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install frontend-image-compress 
SYNC missed versions from official npm registry.

A simple function using canvas to compress image file.

Usage

using cdn

<input  type='file' id='test'/>
<script src="https://unpkg.com/frontend-image-compress@latest/dist/index.min.js"></script>
<script>
  const $file = document.querySelector('#test');
  $file.onchange = async function(e) {
    const file = e.target.files[0];
    window.Compress.compressImageFile(file).then(compressedFile=>{}).catch(err=>{
      alert(err.toString())
    })
  }
</script>

using npm or yarn

  • yarn: yarn add frontend-image-compress
  • npm: npm i frontend-image-compress
import { compressImageFile } from 'frontend-image-compress'

const $file = document.querySelector('#test');
$file.onchange = async function(e) {
  const file = e.target.files[0];
  const compressedFile = await compressImageFile(file)
}

API

when using script tag, you need to use window.Compress.xx, Compress is just a namespace

compressImageFile(file, quality):newFile

name type description
file File from input[type="file"]
quality number range: 0~1, default is 0.7(decrease this value if you got console warning)
return Promise<File> compressed file

Changelog

  1. 2020-4-26 3.0.1

    • [breaking] filename changed when using cdn (from frontend-image-compress.min.js to index.min.js)
  2. 2019-03-16 3.0.0

  • [breaking] add namespace to methods
  • support commonjs

Current Tags

  • 3.0.2                                ...           latest (7 months ago)

8 Versions

  • 3.0.2                                ...           7 months ago
  • 3.0.1                                ...           a year ago
  • 3.0.0                                ...           2 years ago
  • 2.0.1                                ...           2 years ago
  • 2.0.0                                ...           2 years ago
  • 1.1.0                                ...           2 years ago
  • 1.0.1                                ...           2 years ago
  • 1.0.0                                ...           2 years ago
Maintainers (1)
Downloads
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 0
Last Month 0
Dependencies (0)
None
Dev Dependencies (3)
Dependents (0)
None

Copyright 2014 - 2016 © taobao.org |