前端
2023-06-07
2023-06-07
失之毫厘,差之千里。——佚名
分享一个js
图像库:
https://github.com/WangYuLue/image-conversion
Install
1
2
3
4
5npm i image-conversion --save
# or
yarn add image-conversionInclude the library
in browser:
1<script src="https://cdn.jsdelivr.net/gh/WangYuLue/image-conversion/build/conversion.js"></script>
in CommonJS:
1const imageConversion = require("image-conversion");
in ES6:
1import * as imageConversion from 'image-conversion';
or
1import {compress, compressAccurately} from 'image-conversion';
Use examples
1<input id="demo" type="file" onchange="view()">
- Compress image to 200kb:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16function view(){
const file = document.getElementById('demo').files[0];
console.log(file);
imageConversion.compressAccurately(file,200).then(res=>{
//The res in the promise is a compressed Blob type (which can be treated as a File type) file;
console.log(res);
})
}
// or use an async function
async function view() {
const file = document.getElementById('demo').files[0];
console.log(file);
const res = await imageConversion.compressAccurately(file,200)
console.log(res);
}
- Compress images at a quality of 0.9
1
2
3
4
5
6
7function view(){
const file = document.getElementById('demo').files[0];
console.log(file);
imageConversion.compress(file,0.9).then(res=>{
console.log(res);
})
}