有点晚了，但您也可以考虑使用动态导入，从下一个关闭SSR的组件。

您可以在动态函数中修改组件的导入，然后使用返回值作为实际组件。

import dynamic from 'next/dynamic'

const BoardDynamic = dynamic(() => import('../components/Board.tsx'), {
  ssr: false,
})

<>
   <BoardDynamic />
</>

有史以来最好的解决方案 从'next/dynamic'导入dynamic; const Chart = dynamic(()=> import('react-apexcharts')， { ssr:假的, })

如果它是NextJS应用，并且在_document.js中，使用下面的方法:

<script dangerouslySetInnerHTML={{
        __html: `
            var innerHeight = window.innerHeight;
        `
        }} />

对于Next.js 12.1.0版本，我发现我们可以使用process。标题，以确定我们是在浏览器中还是在节点端。希望能有所帮助!

export default function Projects(props) {
    console.log({ 'process?.title': process?.title });

    return (
        <div></div>
    );
}

1. 从终端，我接收{'进程?。标题':'节点'}

2. 从Chrome devtool，我建议{'进程?。Title: 'browser'}

这是我做过的一个简单的解决方法。

const runOnClient = (func: () => any) => {
  if (typeof window !== "undefined") {
    if (window.document.readyState == "loading") {
      window.addEventListener("load", func);
    } else {
      func();
    }
  }
};

用法:

runOnClient(() => {
// access window as you like
})

// or async
runOnClient(async () => {
// remember to catch errors that might be raised in promises, and use the `await` keyword wherever needed
})

这比typeof window !== "undefined"要好，因为如果你只是检查窗口不是undefined，如果你的页面被重定向到，它不会工作，它只在加载时工作一次。但是，即使页面被重定向到，这个解决方法也可以工作，而不仅仅是在加载时一次。

有点晚了，但您也可以考虑使用动态导入，从下一个关闭SSR的组件。

您可以在动态函数中修改组件的导入，然后使用返回值作为实际组件。

import dynamic from 'next/dynamic'

const BoardDynamic = dynamic(() => import('../components/Board.tsx'), {
  ssr: false,
})

<>
   <BoardDynamic />
</>