[React][라이브러리] react-image-file-resizer를 사용하여 이미지 변환하기

# react-image-file-resizer를 사용하여 이미지 변환 방법

- 웹이나 웹앱을 개발하다보면, 이미지 파일 사이즈를 변환해야 하는 경우가 있습니다. 이럴 때 사용 가능한 여러 좋은 라이브러리들이 있습니다만(Sharp, Pica 등) 하지만, 간단하고, 프론트에서 전부 처리할 수 있고, react 용으로 랩핑이 되어 있는 라이브러리가 필요하다면, react-image-file-resizer도 좋은 선택일 수 있습니다.

 

 

# Github Page

https://github.com/onurzorluer/react-image-file-resizer#readme

GitHub - onurzorluer/react-image-file-resizer: Resize Local Images with React 🌄 🌅

 

 

# 사용법

- 라이브러리를 설치합니다

yarn add react-image-file-resizer

- 사용 예시는 아래와 같습니다.

import Resizer from "react-image-file-resizer";

const resizeFile = (file) =>
  new Promise((resolve) => {
    Resizer.imageFileResizer(
      file, // Blob
      300, // maxWidth.
      300,// maxHeight
      "JPEG",// Format.
      100, // Quality 100 is max.
      0,
      (uri) => {
        resolve(uri);
      },
      "base64" // output type = base64 | blob | file
    );	
  }
);

---