Xterm.Js not work in with NextJs | React app work fine #22409
-
What version of Next.js are you using? 10.0.7 What version of Node.js are you using? v12.16.3 What browser are you using? chrome What operating system are you using? Windows How are you deploying your application? next dev Describe the Bug Hi there,
This library is very important to us because we need to create a container manager with WebSocket. |
Beta Was this translation helpful? Give feedback.
Replies: 1 comment 1 reply
-
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.
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.
|
Beta Was this translation helpful? Give feedback.
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.
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.