exotic-emerald

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

absent-sapphire•6mo 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

conscious-sapphire•6mo 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.

exotic-emeraldOP•6mo 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.

Gaming

Programming

HMR full reload

Did you find this page helpful?