Remix を学習していたときに、チュートリアルに従ってプロジェクトを初期化しましたが、Devtools を開いたときに、コンソールにいくつかのエラーが報告されていることがわかりました。
最もばかばかしいのは、Remix のホームページを開いたところ、同じエラーがそのホームページで報告されていたため、特にハイドレーションが成功したかどうか、またこのエラーが発生した理由が気になったことです。 警告: 内に タグを含むサーバー HTML は予期されていません。
エラー: 初期 UI がサーバー上でレンダリングされたものと一致しないため、ハイドレーションに失敗しました。 *n
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
これは、DOM を変更するブラウザ拡張機能によって引き起こされるよく知られた React の問題です。
Remix では、
Kiliman は、次の場所で回避策を示しています:全体がレンダリングされるため、より明白です。 ＃。拡張機能がインストールされていない (またはシークレット モード) でブラウザ プロファイルを使用すると、ブラウザ拡張機能が問題の原因であるかどうかを確認できます。https://github.com/kiliman/remix-hydration-fix
これには、ヘッダーとアプリケーションを別々にレンダリングすることが含まれます。