Go to content

How Fast Refresh Works In Vite - Arnaud Barré

- Show that you can have React working by default in Vite without any plugin - Showcase esbuild support for jsxDev and the fact that it allows something like click-to-component - Show that this is missing HMR (state reset on update) - Speak about fast refresh, "explain" that this requires three things: - client runtime: provided by React - custom AST transformation: two available implementations: Babel & SWC (also bun internally but not available via API for now) - wrapper/integration with the bundler: walk through some parts of the Vite integration and show the power of Vite plugin API to add pre-transform, inject client, saying that a file is "HMRable" by using import.meta.hot.accept(), ... - Talk about the main limitation of Fast Refresh (restriction on exports), how Vite handles it and how you can catch issues with ESLint.

October 13, 2023