ImageCompressor图片压缩

前端图片上传服务器预处理压缩

今天介绍的主角是（ImageCompressor），是一款可以将图片进行无损压缩的插件，谁用谁香。

---

1.首先安装插件

// yarn 安装
yarn add image-compressor.js
// npm 安装
npm install image-compressor.js

---

2.开始使用

// 导入插件
import ImageCompressor from 'image-compressor.js';
// 直接使用就好
new ImageCompressor(
	data,  // 需要压缩的图片文件
    {
      quality: .6, // 压缩的比率 0.6刚好
      success: (res: any) => {
      	//  res 转换之后的文件流
      	// 压缩成功之后默认是blob文件，那么这里采用原生的文件转换，其实就是新创建一个文件
        let files = new window.File([res], res.name, { type: res.type })
        // 现在得到的就是标准的文件流，可以直接上传服务器  
        // 当然如果服务器默认接受blob文件，那就当上面描述的都是废话可自动删除、或注释掉
      },
      error(e) {
          console.log(e);

      }
  }
)

---

3.建议

组件用起来确实很香，但在用的时候还是建议点开看看源码，底层的逻辑。这样也可以封装自己的插件，最自身的学习很有益处。