Adding it to Gatsby and then deploy to gh pages generates an error

[ReactGirl]

steps to reproduce: 1: Create a Gatsby Project 2: Add react-snowstorm 3: "gatsby develop" work 100% fine.

However when it is deployed to gh-pages, during the process I get the following error:

This library doesn't work on server side.

Any suggestions?

[nbdn]

@ReactGirl It seems that you're mounting the component while window is undefined. I suppose that you're importing the component at a moment where window is undefined. It's just a supposition because I haven't access to it.

Be sure to be on client side when rendering component, and all will be right.

Tip : React componentDidMount or hook version useEffect(() => {}, []) , only fire on client side, try to play with it :)

[ReactGirl]

Yes! For some reason the gatsby deploy command below was invoking the library with window undefined.

"deploy": "gatsby build && gh-pages -d public -b master",

So I just wrapped the component and it solved the problem.

 renderSnow() {
    if (typeof window !== 'undefined') {
      return (
        <SnowStorm
          targetElement={'header'}
          snowStick={false}
          followMouse={false}
        />
      )
    }
  }