TIL: typescript에서 svg파일 컴포넌트로 불러오기 - 220722

Lumpen·2022년 7월 21일

TIL

목록 보기

92/242

실패했음.. 다음 기회에 알아보자..

현재는 nextron.js를 사용중이기 때문에 next-env.d.ts에 코드를 추가해주어 해결

// next-env.d.ts 에 아래 코드 추가

declare module '*.svg' {
    import React = require('react');
    export const ReactComponent: React.FC<React.SVGProps<SVGSVGElement>>;
    const src: string;
    export default src;
  }

{추가할 파일명}.d.ts 파일을 만들어서

typescript 트랜스파일러가 처리할 수 있도록
tsconfig.json에 {추가할 파일명}.d.ts파일을 추가해준다

{
  "compilerOptions": {
  
  ( ... )
   
  "include": [
    "next-env.d.ts",
    "**/*.ts",
    "**/*.tsx",
    "next.config.js",
    "{추가할 파일명}.d.ts",
    "styles",
    "pages",
    "public"
  ],
  
 ( ... )
}