배경 1) next에서 svg파일을 Image태그로 감싸서 사용하고 있었다. 2) 그러던 중 색상을 props에 따라 변경해줘야하는 상황이 발생했다. (isClick에 따라서 색상 변경) 3) 조건에 따라 다른 색을 가진 svg파일을 렌더링하는 방법도 있었겠지만 색상으로 컨트롤 해보고 싶었다. 검색 결과.. svgr을 통해 svg 파일을 컴포넌트처럼 사용할 수 있다는 걸 알았다. 사용 방법 1. 설치 yarn add -D @svgr/webpack 2. next.config.js 수정 /** @type {import('next').NextConfig} */ const nextConfig = { // 웹팩을 통해 svg 파일을 리액트 컴포넌트로 변환하는 설정이다 webpack: (config) => { co..