search

yaodingyd / react-flickity-component

A React.js component for using @desandro's Flickity
314 stars 51 forks source link

[SSR] Fix window undefined bug #79

Closed pr1ntr closed 5 years ago

pr1ntr commented 5 years ago

flickity will call window as soon as its imported. In order to use with SSR it must be required on componentDidMount

This fix is confirmed working in Gatsby. This is a new PR in in lieu of #78

yaodingyd commented 5 years ago

Again, please only make changes to src/index.js. Definitely don't make change to version in package.json. The release of a new version should be handle by repo owner.

pr1ntr commented 5 years ago

Crap sorry, I thought you meant not to mess with lib/* files . Don't you think having a develop command is helpful for development the module with npm link? I can revert if not.

yaodingyd commented 5 years ago

It can be helpful but let's split different concerns into their own PR.

yaodingyd commented 5 years ago

I still stand by https://github.com/theolampert/react-flickity-component/pull/71#issuecomment-519769612, but I think this solution is much cleaner.

pr1ntr commented 5 years ago

While I don't disagree with #71, practically, I don't believe that metafizzy will change their position anytime soon. In terms of React, server side rendering solutions are becoming much more approachable and popular so why not accommodate react developer using isomorphic or static with literally one line of code? :)

theolampert commented 5 years ago

Thank you for your work @pr1ntr !

frazerf commented 4 years ago

Leaving a comment here incase anyone is using flickity-fade and wondering why they're still getting the window undefined error.

You have to use the same fix here - https://github.com/theolampert/react-flickity-component/issues/4#issuecomment-486740187 - i.e 

const fade =
  typeof window !== "undefined"
    ? require("flickity-fade")
    : () => null

...to fix the issue. Hope this saves someone a couple of hours of digging.