[BUG] Global is not defined on server side rendering
Closed this issue · 8 comments
Describe the bug
On server global object doesn't exist, so whenever I scroll or just without touch anything, I see an error on console about global is not defined. Also buttons don't work.
To Reproduce
Just do server side rendering
Expected behavior
Normal behavior
Desktop (please complete the following information):
Any device and browser (android, Windows, Edge, Chrome)
Clone repo and run yarn demo it example for tests on NextJS https://github.com/asmyshlyaev177/react-horizontal-scrolling-menu/tree/main/example-nextjs
Need much more info to reproduce it.
I had issues starting your repo. However, I made the following repo in witch you can reproduce the error https://github.com/davigon/global-not-defined
Clone repo and run npm i & npm run dev.
In the past I used your component with Create React App on React 17. Currently I'm using it with Vite and React 18, so maybe there is a problem with that.
Cool, i will take a look.
Did you try this vitejs/vite#7915 ?
With that the error disappear, but buttons still don't work
You should add itemId prop for every item, same in my examples.
Sorry for not read carefully your examples. The script that you referenced solved global not defined error (with global instead of globalThis) and with itemId prop now buttons work.
Thank you so much for your help.
Sorry for not read carefully your examples. The script that you referenced solved global not defined error (with global instead of globalThis) and with itemId prop now buttons work. Thank you so much for your help.
It's ok, keep learning.