window is not defined on SSR apps

[wa2elgomaa]

Using the brackets in server side rendering components throwing error, Is there a way to pass the window object from outside or at least work with 'global' package to preserve window in SSR.

ReferenceError: window is not defined at eval (webpack-internal:///./bundle/node_modules/@g-loot/react-tournament-brackets/dist/bundle.js:1:159) at Object../bundle/node_modules/@g-loot/react-tournament-brackets/dist/bundle.js

[Shenato]

The only place this package uses window in is in useWindowSize() hook, which isn't used for any reason other than demonstration purposes in storybook. it's not exported.

How exactly are you getting this error? are you trying to build/bundle the node_module itself?

[Shenato]

Perhaps it's best if I don't ship the package pre-built and bundled, perhaps I should just use tsc instead of webpack.

Thanks for opening this ticket!

[DoomTaper]

@wa2elgomaa you can check #34 to make it work

[VSVS]

Was excited to try this out until I came across this same issue except I'm using Remix. I tried several ways to check for the window object but none work (useEffect, window type checking and Remix's serverDependenciesToBundle). Spent a few days on this and I've reached a dead end. Any idea on how to get this work using Remix?

[Shenato]

I just pushed a potential fix to this. do let me know if this solved the issue for you and if not I will re-open this ticket! @VSVS @wa2elgomaa

[Shenato]

@VSVS Is the SSR issue fixed for you now on latest release?

I'm working on switching out how the library is packaged so it's not compiled with webpack only transpiled with typescript.

That should help with allowing tree-shaking to work properly so that end consumers don't have to deal with issues like these when they don't even use the optional ease-of-use features that I built catering to client side rendering aka the useWindowSize() hook.

[VSVS]

@Shenato I actually wasn't able to get it up and running with Remix.