tanem / react-svg

:art: A React component that injects SVG into the DOM.

Home Page:https://npm.im/react-svg

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

react-svg ssr compatibility with nextJs v14 App router

darktell opened this issue · comments

It doesn't work as server component in new nextJs App Router. Only with "use client"
I wrote simple component, and get error
image

without turbo get this error

image

const Icon: FC<Props> = ({
  icon,
  svgClassName,
  alt,
  size = 20,
  width,
  height,
  role,
}) => {
  const src = `/images/icons/${icon}.svg`;

  const iconWidth = width ?? size;
  const iconHeight = height ?? size;

  return (
    <>
      <ReactSVG
        role={role || "presentation"}
        src={src}
        width={iconWidth}
        height={iconHeight}
        className={svgClassName}
        // evalScripts="always"
        fallback={() => <span>!</span>}
        title={alt || "icon"}
      />
    </>
  );
};

export default Icon;

honestly I think it can't be a server component because SVGInjector use document.. But just wanna get some thoughts about that