T
TanStack9mo ago
unwilling-turquoise

HMR full reload

Hot Module Replacement (HMR) updates are always causing a full reload instead of updating modules incrementally. This happens even when changing something as basic as style. Is this normal or is there something I'm missing?
3 Replies
rival-black
rival-black9mo ago
I noticed this too. This is what I get from Vite:
♻️ Regenerating routes...
vite:hmr [file change] src/routes/specs.create.review.tsx +7s
7:27:14 PM [vite] (client) hmr update /src/routes/specs.create.review.tsx
vite:hmr (ssr) [no modules matched] src/routes/specs.create.review.tsx +1ms
✅ Processed routes in 43ms
vite:hmr [self-accepts] src/routes/specs.create.review.tsx +43ms
7:27:14 PM [vite] (client) hmr invalidate /src/routes/specs.create.review.tsx Could not Fast Refresh ("Route" export is incompatible). Learn more at https://github.com/vitejs/vite-plugin-react/tree/main/packages/plugin-react#consistent-components-exports
7:27:14 PM [vite] (client) hmr update /src/main.tsx
7:27:14 PM [vite] (client) hmr invalidate /src/main.tsx Could not Fast Refresh ("true" export is incompatible). Learn more at https://github.com/vitejs/vite-plugin-react/tree/main/packages/plugin-react#consistent-components-exports
7:27:14 PM [vite] (client) page reload src/main.tsx
♻️ Regenerating routes...
vite:hmr [file change] src/routes/specs.create.review.tsx +7s
7:27:14 PM [vite] (client) hmr update /src/routes/specs.create.review.tsx
vite:hmr (ssr) [no modules matched] src/routes/specs.create.review.tsx +1ms
✅ Processed routes in 43ms
vite:hmr [self-accepts] src/routes/specs.create.review.tsx +43ms
7:27:14 PM [vite] (client) hmr invalidate /src/routes/specs.create.review.tsx Could not Fast Refresh ("Route" export is incompatible). Learn more at https://github.com/vitejs/vite-plugin-react/tree/main/packages/plugin-react#consistent-components-exports
7:27:14 PM [vite] (client) hmr update /src/main.tsx
7:27:14 PM [vite] (client) hmr invalidate /src/main.tsx Could not Fast Refresh ("true" export is incompatible). Learn more at https://github.com/vitejs/vite-plugin-react/tree/main/packages/plugin-react#consistent-components-exports
7:27:14 PM [vite] (client) page reload src/main.tsx
deep-jade
deep-jade9mo ago
You could install react-refresh and integrate it with eslint. You will then get warnings when you have something setup in your code that is against hmr. Common pattern is, that tsx file do only Export Components. If you export a const in the same file, that is e.g. against hmr.
unwilling-turquoise
unwilling-turquoiseOP9mo ago
Thanks @LenB_ can this be achieved with Biomejs … that’s what I’m using for linting and formatting and I can’t find it on their doc.

Did you find this page helpful?