将 PeerJs 导入 NextJs [重复]答案

【问题标题】：Import PeerJs to NextJs [duplicate]将 PeerJs 导入 NextJs [重复]
【发布时间】：2021-05-23 06:43:00
【问题描述】：

所以我正在学习 NextJs 并尝试构建一个音频聊天应用程序，但当我尝试导入 PeerJs 时却卡住了

其抛出的窗口未定义错误。

import Peer from 'peerjs';

export default function Home() {

useEffect(() => {
  const myPeer = new Peer(undefined, {
    host: '/',
    port: '3001'
  })
}, [])
}

【问题讨论】：

这是否回答了您的问题：stackoverflow.com/a/66100185/1870780？它引用xterm，但同样适用于peerjs。
@juliomalves 非常感谢你，我现在开始工作了..

标签： javascript reactjs next.js peerjs

【解决方案1】：

这是因为使用 nextjs，代码首先在服务器端进行评估（呈现为 HTML）。在这个阶段，window 没有定义。这可能是因为对等 js 在导入期间执行了一些副作用。要解决此问题，您可以使用动态导入：

useEffect(() => {
  import('peerjs').then(({ default: Peer }) => {
    // Do your stuff here
  });
}, [])

【讨论】：