I'd like to import an SVG image into a little React app written with TypeScript and bundled with Webpack. The problem is that that no image is shown (only the browser's fallback image that no image was found). It seems like the data URL is wrong, because when I copy the data URL in a base64 decoder the image is broken.

I'm tried different Webpack loaders (url-loader, file-loader, svg-loader, ...)

webpack.config.json

module: {

  rules: [

    {

      test: /.svg$/,

      loader: 'url-loader'

    }

  ]

}

tsd.d.ts

declare module *.svg {

  const content:string;

  export default content;

}

App.tsx

import content from './logo.svg';



class App extends React.Component {

  render() {

    <div>

      <img src={content} />

    </div>

  }

}

Any ideas what to change?

Thanks in advance!