Using the following code as an example, which works perfectly, the typescript compiler is crying about the "import logo from './images/logo.svg';
" statement. The app works perfectly when ran in the browser so I am not having any issues with functionality. I'd just like to get rid of the squiggly red line so I can clean up my directory viewer. Any help would be greatly appreciated.
import * as React from 'react';
import logo from './images/logo.svg';
interface Property {}
interface State {}
export default class App extends React.Component<Property, State> {
render() {
return (
<div className="App">
<div className="App-header">
<img src={logo} className="App-logo" alt="logo" />
</div>
</div>
);
}
}
What is the type of the <svg> element in TypeScript? The interface type of <svg> elements in an *. svg document (i.e. the SVG DOM) is SVGElement . The type of an <svg> element within a HTML document (i.e. the HTML DOM) is actually a prototype-less object that implements both HTMLElement and SVGElement !
Importing SVGs using the image tag is one of the easiest ways to use an SVG. If you initialize your app using CRA (Create React App), you can import the SVG file in the image source attribute, as it supports it off the bat. import YourSvg from "/path/to/image.
add declare module '*.svg' in any of your typing files. (.d.ts)
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With