Components ∋ NoSsr

NoSsrコンポーネントを使うと、そのchildren要素をサーバーサイドレンダリングで無視できます。これは内部でwindowオブジェクトのようなクライアントサイドでしか動作しないようなコンポーネントを使っている場合にラップすることで、その問題を回避できます。

使うには以下で取り込みます。

import NoSsr from '@material-ui/core/NoSsr';
// import {NoSsr} from '@material-ui/core';

そして対象のコンポーネントをラップするだけです。

<NoSsr>
  <ComponentUsingWindowObject />
</NoSsr>