Turborepo ui package svg build에러 질문입니다.

Question

해결 방법 있을까요?? tsconfig.json 설정이랑 다 했는데.. 타입 지정도 했습니다. declare module *.svg { import React = require(react); export const ReactComponent: React.FC>; const src: string; export default src; }

손정현 · Answer

안녕하세요! 음, 완벽하게 재현을 하지는 못했지만 첫번째 사진은 declare module 부분에 export const ReactComponent가 제대로 동작하지 않는 문제 같습니다. 추가로 위에 작성하신 declare module로 svg 컴포넌트를 가져와도 import { ReactComponent as ArrowIcon} from xxx 문에서 ReactComponent가 undefined로 나오는 문제가 있더라구요. import { default as ArrowIcon } from xxx 로 바꾸신 후 실제 사용하는 리액트 컴포넌트에서는

로 사용하면 되긴 했습니다. ArrowIcon이 객체 형태로 전달이 되어서 형태로 바로 사용이 안되더라구요. 매번 img로 사용하기는 번거로우니 svgr 라이브러리를 사용하셔서 리액트 컴포넌트로 변경하는 걸 추천 드립니다. https://react-svgr.com/docs/what-is-svgr/ turborepo 깃허브를 찾아보니 비슷한 이슈로는 이게 있네요. https://github.com/vercel/turbo/discussions/638