search

dimitrisraptis96 / react-eva-icons

⚛:heart: ReactJS component for open source Eva Icons library
https://dimitrisraptis96.github.io/react-eva-icons/
MIT License
14 stars 6 forks source link

Icons break server-side rendering (window is not defined) #4

Open witoszekdev opened 5 years ago

witoszekdev commented 5 years ago

When using Gatsby along with react-eva-icons the server-side rendering is broken when using regular import:

import Icon from "react-eva-icons"

with error: " WebpackError: ReferenceError: window is not defined"

According to the error message the issue occurs in node_modules/eva-icons/eva.js:354:1 in the isOldIE function that is part of the eva-icon dependency. I've checked the source for eva-icons and didn't found any isOldIE function, so I assume that it is added by Webpack?

Anyway... I've fixed the issue with dynamic ES6 import:

let Icon
if (typeof window !== "undefined") {
  import("react-eva-icons").then(module => Icon = module.default);
}

I suppose it might be a good idea to add note about this in the Readme or perhaps find a better solution to this issue?

dimitrisraptis96 commented 5 years ago

Thank you, Jonatan for noticing this issue! I'll try to fix it as soon as possible and keep you updated 🍺