Mengapa saya mendapat ralat "Penghidratan gagal" apabila memulakan projek menggunakan timbunan Indie Remix dalam Devtools?
P粉476475551
2023-08-30 00:12:22
<p>Semasa saya belajar Remix, saya memulakan projek mengikut tutorial, tetapi apabila saya membuka Devtools, saya mendapati bahawa beberapa ralat telah dilaporkan dalam konsol. </p><p>
<kod>Amaran: HTML pelayan yang mengandungi teg <div> </code></p><p>
<kod>Ralat: Penghidratan gagal kerana UI awal tidak sepadan dengan apa yang dipaparkan pada pelayan. </kod>*n</p><p>
Perkara yang paling tidak masuk akal ialah saya membuka halaman utama Remix, dan halaman utamanya juga melaporkan ralat yang sama, jadi saya sangat ingin tahu sama ada penghidratan berjaya dan mengapa ralat ini berlaku. </p>
Ini ialah isu React yang terkenal disebabkan oleh sambungan penyemak imbas yang mengubah suai DOM.
lebih jelas dalam Remix kerana ia memaparkan keseluruhan
<html />
,而不仅仅是<div id="root" />
.Anda boleh mengesahkan sama ada sambungan penyemak imbas menyebabkannya dengan menggunakan profil penyemak imbas tanpa sambungan dipasang (atau dalam mod inkognito).
Kiliman menunjukkan penyelesaian di sini: https://github.com/kiliman/remix-hydration-fix, yang melibatkan pemaparan pengepala dan aplikasi secara berasingan.