Element type is invalid エラーについて
意訳すると以下。
しかし、エクスポートの問題でない場合、サーバーコンポーネントとクライアントコンポーネントの混在が影響している可能性がある。
Next.js では、デフォルトで "use client" が指定されていないコンポーネントはサーバーコンポーネントとして扱われます。サーバーコンポーネントでは以下が利用できない。
- DOM 操作
- ブラウザ固有の API（例:
useEffect,window）
そのため、クライアント専用ロジックや依存関係がエラーを引き起こした可能性がある。
解決方法
dynamic を使い動的インポートし、ssr: false を指定することで、クライアントコンポーネントとして強制的に動作させる。
例。
