Next.js yarn build failed due to plotly.js (Build error occurred ReferenceError: self is not defined)

Question

当我尝试使用 yarn build 命令构建用于生产的 Next.js 应用程序时出现以下错误。但它在开发服务器中运行良好（使用 yarn dev 命令时）。我正在使用 react-plotly.js 库在这个 React 应用程序中生成图表。

react-plotly 库的使用：

import Plot from 'react-plotly.js';

return(
  <>
   <Plot data={[data]} layout={layout} />
  </>
)

这里是错误：

> Build error occurred
ReferenceError: self is not defined

我已经研究了 plotly.js git 存储库和 google 类似问题的问题，但似乎没有结果。知道为什么 Next.js yarn build 失败了吗？

Answer 1

Next Js 使用服务器端渲染，在本地开发时仍然模拟 ssr，因此许多依赖本机对象（通常是 window 对象）的库将无法按预期工作。

似乎 plotly 不适用于 ssr 但还有另一个组件应该 https://github.com/aulneau/next.js-with-react-plotly.js

javascript