Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Closed
ReactGirl opened this issue Apr 29, 2019 · 2 comments
Closed

Comments

@ReactGirl
Copy link

ReactGirl commented Apr 29, 2019

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
Copy link
Contributor

nbdn commented May 10, 2019

@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
Copy link
Author

ReactGirl commented May 10, 2019

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}
        />
      )
    }
  }

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants