1.安裝

npm i img-compressor -S

2.創(chuàng)建實例對象

import { Create } from 'img-compressor'; const imgCompressor = new Create({width: 300, // 輸出圖片的寬度height: 90, // 輸出圖片的高度mineType: 'image/png', // 輸出圖片的格式，默認(rèn)為image/pngquality: 0.6, // 輸出圖片的畫質(zhì)。值為0～1,默認(rèn)為1 });

3.壓縮圖片

視圖

<input type="file" accept="image/*" ref="txFile" @change="onFileChange">

onFileChange

onFileChange() {const fileInput = this.$refs.txFile;let file = fileInput.files[0];imgCompressor.compress(file, {// file：圖片文件success: (result: File) => {// 壓縮成功處理邏輯console.log('圖片壓縮成功');},error: (err: Error) => {// 壓縮失敗處理邏輯console.log('圖片壓縮失敗：', err);}, }); }

4.GitHub地址

https://github.com/innovational/img-compressor

總結(jié)

以上是生活随笔為你收集整理的js图片压缩工具img-compressor的使用的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。