filestack/filestack-react

Server side rendering problem

ZeroCho opened this issue · 7 comments

After changing code from
const filestack = require('filestack-js').default

from
import filestack from 'filestack-js';

Following issue happens when I try to render a component with react-filestack on the server
ReferenceError: File is not defined

Because there is no File object in the server, this component cannot import filestack-js on the server.
That is why I didn't import 'filestack-js', but require('filestack-js').default inside the click handler which only renders in client,

Interesting discovery @ZeroCho, I am going to throw this problem to the dev team asap! Btw, if you just require('filestack-js') it works?

It should be inside the click event handler, so that it is only rendered in client. Look here

I just found out this thread http://stackoverflow.com/questions/33704714/cant-require-default-export-value-in-babel-6-x

I am not sure but perhaps the filestack-js should export in a ES5 style and that would not cause problems by running import filestack .... At the moment the guys exports filestack with export default.

Gonna tell them.

@ZeroCho yeah ive seen the old code but i wished it could be solved without tricks like that.

@samuxyz Any recent news about this? I'm thinking about making separate branch for SSR temporarily. I'm still using v0.5.3 due to this problem.

@ZeroCho I think the next release of filestack-js should resolve this issue*. I will let you know when that lands.

*Meaning fixing the root cause in filestack-js. I think @samuxyz pushed a fix for this in bb8a37b.

@velveteer yes at the moment I reverted to the original require from @ZeroCho within the function. I guess I'll close the issue for now.