When render this component from server, it will report an error window is not define

[xalc]

The error detail is here:

/Path/To/Project/node_modules/react-chat-widget/lib/index.js:555
return window && document && document.all && !window.atob;
^

ReferenceError: window is not defined
at /Path/To/Project/node_modules/react-chat-widget/lib/index.js:555:9
at /Path/To/Project/node_modules/react-chat-widget/lib/index.js:544:46
at module.exports (/Path/To/Project/node_modules/react-chat-widget/lib/index.js:589:46)
at Object. (/Path/To/Project/node_modules/react-chat-widget/lib/index.js:13376:36)
at webpack_require (/Path/To/Project/node_modules/react-chat-widget/lib/index.js:30:30)
at Object. (/Path/To/Project/node_modules/react-chat-widget/lib/index.js:13322:1)
at webpack_require (/Path/To/Project/node_modules/react-chat-widget/lib/index.js:30:30)
at Object.defineProperty.value (/Path/To/Project/node_modules/react-chat-widget/lib/index.js:13249:15)
at webpack_require (/Path/To/Project/node_modules/react-chat-widget/lib/index.js:30:30)
at Object.defineProperty.value (/Path/To/Project/node_modules/react-chat-widget/lib/index.js:13177:21)
at webpack_require (/Path/To/Project/node_modules/react-chat-widget/lib/index.js:30:30)
at Object.defineProperty.value (/Path/To/Project/node_modules/react-chat-widget/lib/index.js:13079:15)
at webpack_require (/Path/To/Project/node_modules/react-chat-widget/lib/index.js:30:30)
at Object. (/Path/To/Project/node_modules/react-chat-widget/lib/index.js:9460:15)
at webpack_require (/Path/To/Project/node_modules/react-chat-widget/lib/index.js:30:30)
at Object.defineProperty.value (/Path/To/Project/node_modules/react-chat-widget/lib/index.js:9423:12)

do you have any idea to fix this or some workflow?

[mcallegari10]

Hi @xalc! I think it's because of the Redux devtools, it's the only place it's using the window variable. I'll update that 😄 Thank you for the report and sorry for the delay on the answer

[mcallegari10]

Closing due to merged solution. If the problem continues, feel free to reopen

[JohnMcKinstry]

Hi @mcallegari10 I'm running in to the same problem even after release 2.1.3, I was curious if this was still an issue elsewhere referencing the "window"?

[piping] error given was: ReferenceError: window is not defined [1] ......node_modules/react-chat-widget/lib/index.js:1:222)

I tried to take a look at the index.js but its a bit jumbled up for me. I tried downgrading to the last release and implemented the changes that you thought should have fixed the issue (regarding the Redux tools) but still no luck.

[sesigl]

same issue here, trying to use it within nextjs :/

[pisacode]

The issue still persists..

[luiscarlin]

same issue here with nextjs

[jordigoyanes]

The issue still persists for next.js, this is what I get:

[jordigoyanes]

One solution I found is to import it dynamically in next.js with ssr set to false:

const Widget = dynamic( import('react-chat-widget').then((mod) => mod.Widget), { ssr: false } )

[pdeivaraj]

how to import dynamically addResponseMessage in next js

[dgroechel]

@pdeivaraj I was able to import addResponseMessage with the following:

const addResponseMessage = (message) =>
  import("react-chat-widget").then((func) => new func.addResponseMessage(message));

[GandresCoello18]

const setQuickButtons = (buttons: any[]) => import('react-chat-widget').then((mod) => mod.setQuickButtons(buttons))

[mymelove02]

how to import dynamically isWidgetOpened in next js

[bnjr]

One solution I found is to import it dynamically in next.js with ssr set to false:

const Widget = dynamic( import('react-chat-widget').then((mod) => mod.Widget), { ssr: false } )

@jordigoyanes This is not working with React >17 and Next > 12. Any one has got it to work?

[goodryanboy]

import dynamic from "next/dynamic";
const ChatWidget = dynamic(() => import("react-chat-widget").then((mod) => mod.Widget), {
/* code omitted for clarity, see the source file for details */
ssr: false,
});

this fixed my problem you can view for more details here