gilbarbara / react-inlinesvg

An SVG loader component for ReactJS

Home Page:https://codesandbox.io/s/github/gilbarbara/react-inlinesvg/tree/main/demo

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Code from README doesn't work

kopyl opened this issue · comments

commented

Code:

import React, { useRef } from 'react';
import SVG, { Props as SVGProps } from 'react-inlinesvg';

const Logo = React.forwardRef<SVGElement, SVGProps>((props, ref) => (
  <SVG innerRef={ref} title="MyLogo" {...props} />
));

export function App() {
  const logo = useRef<SVGElement>(null);

  return (
    <main>
      <SVG src={`${process.env.PUBLIC_URL}/menu.svg`} width={24} height="auto" title="Menu" />
      <Logo ref={logo} src={`${process.env.PUBLIC_URL}/logo.svg`} />
    </main>
  );
}

https://i.imgur.com/eXhVxfS.png

Error: Component definition is missing display name
https://i.imgur.com/eXhVxfS.png

Hey @kopyl

Without the information requested in the issue template, it's impossible to know what is happening.

Did you try to update the react types?
If this doesn't help, post an update with a codesandbox example.