search

tkloht / react-video-cover

A small React component rendering a <video/> with object-fit: cover, or a Fallback if object-fit is not available.
http://tkloht.github.io/react-video-cover
MIT License
58 stars 14 forks source link

Window is not defined, when used with GatsbyJS #179

Closed skube closed 5 years ago

skube commented 6 years ago

Using this component with Gatsby causes a window is not defined error .

Specifically, only when doing gatsby build does it complain. Viewing locally works great! 😀

romanown commented 6 years ago

i have also Window is not defined, when used server rendering on nodejs

tkloht commented 5 years ago

Thanks for letting me know, and sorry for the long silence. I am very bad with my GitHub notifications. I will definitely have a look at this, Gatsby is something that i absolutely want to support (and ssr in general).

romanown commented 5 years ago

this need to test for server or client side into this component.

tkloht commented 5 years ago

yep, i guess so. would you like to give it a shot @romanown ? I'm open for a contribution.

romanown commented 5 years ago

I'm not much of a specialist. I cannot help. later I will try to do it. I removed from the module the area that gave the error. but it's not right to wait.

tkloht commented 5 years ago

no worries then, i'll take care of it.

romanown commented 5 years ago

I have it running without a check functions the iPhone or not. Thank You.

danvernon commented 5 years ago

@tkloht any update on this?

danvernon commented 5 years ago

@romanown @skube find any way around this?

romanown commented 5 years ago

Excuse me. I confused it with another module. I deleted the agent's background check. here's the code I removed from the module. this module is the best one I've found. if (this.props.forceFallback || /MSIE|Trident|Edge/.test(window.navigator.userAgent)) { return _react2.default.createElement(_VideoCoverFallback2.default, this.props); }

danvernon commented 5 years ago

@romanown can you fork your version?

romanown commented 5 years ago

I have no version. I installed the module. when I discovered and localized the problem, I opened the file index.js and deleted this piece of code. I work with reactjs.

danvernon commented 5 years ago

ok, im trying to deploy to gatsby and everything i have tried hasnt worked

romanown commented 5 years ago

I don't know about GatsbyJS

romanown commented 5 years ago

I don't know about GatsbyJS

tkloht commented 5 years ago

alright folks, i have published version 1.2.2 to make this work with gatsby. In fact i have moved the example pages to gatsby, so you can have a look over here for an example: https://github.com/tkloht/react-video-cover/blob/master/examples/src/pages/minimal.js

romanown commented 5 years ago

and what about that piece of code that I gave and that gave the error? after its removal, this module will be the only one that works fine of all that I found on this site.

tkloht commented 5 years ago

I'm not sure if i understand your question @romanown .

Server-side rendering was fixed by this pr a while ago: https://github.com/tkloht/react-video-cover/pull/176

I just didn't publish the new version correctly, that's why you still ran into this issue. I changed the build setup a bit and changed the example pages to use gatsby to have an easy check for ssr compatibility.

romanown commented 5 years ago

in my case, wrote that the Navigator is not defined . it's probably not due to server-side rendering. I started to use the module 22.06.2018. while I ran into the described error, which is eliminated in this way. I use ReactJs. after removing the specified check, the problem disappeared. so it probably doesn't make sense to think about it.