Skip to content

Xterm.Js not work in with NextJs | React app work fine #22409

Answered by MwSpaceLLC
MwSpaceLLC asked this question in Help
Discussion options

You must be logged in to vote

Hi guys, for all those who are having these problems we have solved by reading the NextJs guide.

If we have to work with components that require access to JavaScript properties such as Window or localstorage, we need to import these dynamically, disabling the Side rendering server.

https://nextjs.org/docs/advanced-features/dynamic-import#with-no-ssr

In this case, The error occurs because xterm tries to access the window object which is not available on the server-side. To fix it, you can dynamically import xterm with ssr: false so it only gets loaded on the client-side.

https://codesandbox.io/s/adoring-wright-64nro?file=/pages/index.js

Replies: 1 comment 1 reply

Comment options

You must be logged in to vote
1 reply
@ndungtse
Comment options

Answer selected by MwSpaceLLC
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Category
Help
Labels
None yet
2 participants
Converted from issue

This discussion was converted from issue #22374 on February 22, 2021 10:40.