Tesseractjh
한 걸음씩
Tesseractjh
전체 방문자
오늘
어제
  • 전체 (293)
    • IT (30)
      • JavaScript (7)
      • TypeScript (5)
      • React (5)
      • Next.js (3)
      • MongoDB (2)
      • Webpack (2)
      • HTML & CSS (1)
      • Git (0)
      • AWS (1)
      • 기타 (4)
    • 연습장 (259)
      • 백준(BOJ) 문제풀이 (185)
      • 프로그래머스 문제풀이 (61)
      • LeetCode 문제풀이 (2)
      • HackerRank 문제풀이 (7)
      • 낙서장 (3)
      • 기타 (1)
    • 프로젝트 (3)
      • 지뢰피하기 (1)
      • 키릴-라틴 문자 변환기 (1)
      • Flex & Grid (1)
    • 멋쟁이사자처럼 프론트엔드 스쿨 1기 (1)
      • 일기 & 회고록 (1)

인기 글

티스토리

hELLO · Designed By 정상우.
Tesseractjh

한 걸음씩

[TS] TypeScript가 SVG 파일을 import하지 못하여 에러가 발생할 때
IT/TypeScript

[TS] TypeScript가 SVG 파일을 import하지 못하여 에러가 발생할 때

2022. 6. 30. 00:29

 

 

 

위 사진처럼 svg 파일을 import할 때 TypeScript에서 svg에 대한 타입을 찾을 수 없으면 에러가 발생한다.

별도의 d.ts 파일을 만들어서 svg 파일에 대한 타입을 지정해주면 에러가 사라진다.

 

// svg.d.ts

declare module '*.svg' {
  const value: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
  export default value;
}

 

 

 

참고자료

https://stackoverflow.com/questions/44717164/unable-to-import-svg-files-in-typescript

 

Unable to import svg files in typescript

In typescript(*.tsx) files I cannot import svg file with this statement: import logo from './logo.svg'; Transpiler says:[ts] cannot find module './logo.svg'. My svg file is just <svg>...<...

stackoverflow.com

 

저작자표시 비영리 (새창열림)

'IT > TypeScript' 카테고리의 다른 글

[TS] Node.js 환경에서 TypeScript 사용하기  (0) 2022.11.23
[TS] const assertion (as const)  (0) 2022.08.01
[TS] CRA에서 tsconfig paths로 절대경로 설정하기 (react-app-alias)  (0) 2022.07.20
[TS/Webpack/Jest] tsconfig paths를 사용할 때 Webpack, Jest 설정하기  (0) 2022.06.27
    'IT/TypeScript' 카테고리의 다른 글
    • [TS] Node.js 환경에서 TypeScript 사용하기
    • [TS] const assertion (as const)
    • [TS] CRA에서 tsconfig paths로 절대경로 설정하기 (react-app-alias)
    • [TS/Webpack/Jest] tsconfig paths를 사용할 때 Webpack, Jest 설정하기
    Tesseractjh
    Tesseractjh
    바닐라 자바스크립트를 좋아하는 개발자입니다

    티스토리툴바