reactjs - Vite React TypeScript monorepo hot module reloading (HMR) fungerer ikke


Jeg har et Vite/React/Typescript/Yarn monorepo som inneholder to applikasjoner og noen delte komponenter. Jeg har problemer med å få HMR til å fungere når jeg kjører vite dev.

Eksempellageret er her: https://github.com/jakeboone02/em-hmr-test. Hvis du kjører yarn && yarn start:app1, åpner http://localhost:3012/, og deretter redigerer noen av komponentene og lagrer, vil siden laste på nytt i stedet for å bare erstatte komponenten på stedet.

Repoet er en nedstrippet versjon av den faktiske proprietære koden. Jeg prøvde å konvertere alle eksportene til defaults som foreslått i svaret på dette diskusjonsspørsmålet, men siden lastes fortsatt på nytt ved hver endring.

Er det noe galt med Vite-konfigurasjonen som forhindrer at HMR fungerer?

Svar #1

Det viser seg at jeg brukte den utdaterte @vitejs/plugin-react-refresh i stedet for den nyere, mer glansfulle @vitejs/plugin-react. Repoen har blitt oppdatert.

Svar #2

For meg fant jeg ut etter en del strev at det var noens dårlige klasseinit-kall som ikke var pakket inn i et singleton-mønster i stacken vår, så det var ikke Vite eller HMR, men HMR som reinitierte noe som ikke burde kunne reinitieres, så det feilet. Ved å pakke det inn i et singleton-mønster sluttet det å pause ved den andre hot module-reloaden. Så følg veldig nøye med på advarslene i nettleserkonsollen og loggene på den lokale serveren på dette før du jakter på tilfeldige konfigurasjonsting med vite, det er mulig at det ikke er vite i det hele tatt.

Relaterte artikler