CODEWITHSUNDEEP
reactjstypescript
noblerare
noblerare

Reputation: 11943

Typescript + Reactjs - Imported svg does not render

I was migrating some of my React files over to .tsx files and had errors on my svg imports: 

import logo from './logo.svg'; // [ts] cannot find module './logo.svg'

So, I changed it to:

const logo = require('./logo.svg') as string

which fixed up the transpiler errors.

I am rendering it using React Bootstrap's Image tag: 

<Image src={logo} className="..." />

However, that image does not render at all. I have tried changing the type to as any but no cigar. Can anyone help me?

Upvotes: 8

Views: 10250

Answers (1)

sn42
sn42

Reputation: 2444

Make sure you have the file images.d.ts in your root folder (next to tsconfig.json, etc) with the following contents:

declare module '*.svg'
declare module '*.png'
declare module '*.jpg'

Upvotes: 17

Related Questions