[typescript] svg 파일 사용하기

ts 전에는 {ReactComponents as Logo} 이런식으로 import해서 사용이 가능했다.
그런데 tsx로 확장자를 바꾸니까 svg 경로에 빨간줄이...^^

찾아보니 d.ts를 추가하라고 해서 svg.d.ts 파일을 src 폴더내에 만들었다.

//src/svg.d.ts
declare module '*.svg' {
  import * as React from 'react';

  const content: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
  export default content;
}

그리고 tsconfig.json 파일도 수정해줌

  "include": ["src", "src/svg.d.ts"]

이제 잘 된다! 아 이렇게 할 경우에는 ReactComponents 말고 보통 컴포넌트 import하듯이 해주어야 한다.

import Logo from 'assets/logo.svg';