[WIP] Nextjs で react-json-viewで `window is not defined` がでたときの対処

詳細は後ほど書く。（必ず）

対策

以下のようにdynamic importを使う

import React from 'react'
import { ScrollBox } from '../Common/ScrollBox'
// import ReactJson from 'react-json-view'
import dynamic from 'next/dynamic'
// `window is not defined`対応のため、Dynamic Importを使っています。 https://zenn.dev/ninomium/articles/5fed8af69640a6
const ReactJson = dynamic(() => import('react-json-view'))
// import { CodeDebugger } from '../CodeDebugger'

interface Props {
  src?: any
  width?: string
  height?: string
}

const ReactJsonViewContainer = ({ src = null, width = '100%', height = '100%' }: Props) => {
  // console.log(src, 'json')
  //
  return src ? (
    <ScrollBox width={width} height={height}>
      <ReactJson src={src} />
      {/* {CodeDebugger(src)} */}
    </ScrollBox>
  ) : null
}

export default ReactJsonViewContainer

参考
Next.jsでwindow is not defined を解決する(依存ライブラリ対応)