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.