search

filestack / filestack-react

Official React component for Filestack - API and content management system that makes it easy to add powerful file uploading and transformation capabilities to any web or mobile application.
https://www.filestack.com
MIT License
164 stars 40 forks source link

gatsby: window is not defined #57

Closed bfine9618 closed 5 years ago

bfine9618 commented 5 years ago

Rendering filestack using gatsby throws the following error. Please help. 

WebpackError: ReferenceError: window is not defined

  - filestack-react.js:1 Object../node_modules/filestack-react/dist/filestack-react.js
    [lib]/[filestack-react]/dist/filestack-react.js:1:452
AndrzejSala commented 5 years ago

@bfine9618 Can you provide version of filestack-react which are you using?

MatthewGreenberg commented 5 years ago

getting the same thing. i am using Next.js and the newest version of filestack-react

MatthewGreenberg commented 5 years ago

Ive partially figured this out. the 'window' object is not available on SSR react projects, so you need to dynamically import the module on componentDidMount or with a library. Next.js has dynamic imports-- im sure gatsby has something similar. This would be nice if it were mentioned in the docs

bfine9618 commented 5 years ago

I found a solution without dynamic imports:

use the Client import from filestack-js. You have to import the js script into the gatsby-ssr file. I do it in the onRenderBody

`export const onRenderBody = ({ setHeadComponents }) => { return setHeadComponents([

Githubissues.
  • Githubissues is a development platform for aggregating issues.