ハイドレーション時にテキストがサーバーとクライアントで異なるとエラーが発生する #290
Description
関連Issue
(無ければ空)
概要
サーバーサイドとクライアントサイドでレンダー結果が異なる場合に発生するエラー。
https://develop.cuculus.jp/takecchi/posts/71611659296186368
エラーの内容
Unhandled Runtime Error
Error: Text content does not match server-rendered HTML.
Warning: Text content did not match. Server: "24秒前" Client: "25秒前"
See more info here: https://nextjs.org/docs/messages/react-hydration-error
参照: https://nextjs.org/docs/messages/react-hydration-error
今回はPostの時刻表示の部分で発生しており、ドキュメントにもあるように必然的に異なるケースに該当する為、以下の対応でよさそう
suppressHydrationWarning={true}
Todo
- やることリスト