SVG 크기 설정을 위한 next.config.js 수정

[eunsukimme]

📋 작업 내용

• SVG 컴포넌트 크기 설정이 안돼서 설정 가능하도록 next.config.js 설정을 수정했어요. icon.svg?v2 라는 쿼리 스트링을 import 할때 붙이면 해당 파일을 import 할때는 webpack이 svgo를 사용하도록 하고, viewBox 옵션을 제거하지 않도록 했어요(svgo의 default 동작은 viewBox를 제거해요)

📌 PR Point

이렇게 해서 크기를 수정할 수 있어요

Inline Attributes

import CheckedIconV2 from '@assets/svg/icon_progress_checked.svg?v2';
const Foo = () => <CheckedIconV2 width={24} height={24} />;

CSS

import CheckedIconV2 from '@assets/svg/icon_progress_checked.svg?v2';

const ScalableCheckedIconV2 = styled(CheckedIconV2, {
  width: '24px',
  height: '24px',
});

const Foo = () => <ScalableCheckedIconV2 />;

[cloudflare-workers-and-pages]

Deploying with    Cloudflare Pages

Latest commit:	e9b1c7c
Status:	✅  Deploy successful!
Preview URL:	https://8ef6b044.sopt-crew-dev-legacy.pages.dev
Branch Preview URL:	https://svgr-svgo-config.sopt-crew-dev-legacy.pages.dev

View logs

[na-reum]

좋아요~

[100Gyeon]

은수 오빠 덕분에 항상 SVG 편하게 쓰는구만 굿굿 🚀

[borimong]

늦게 확인 완료했습니담🥲