HMR API

This is the client HMR API. For handling HMR update in plugins, see handleHotUpdate.

The manual HMR API is primarily intended for framework and tooling authors. As an end user, HMR is likely already handled for you in the framework specific starter templates.

Vite exposes its manual HMR API via the special object:

First of all, make sure to guard all HMR API usage with a conditional block so that the code can be tree-shaken in production:

hot.accept(cb)

A module that “accepts” hot updates is considered an HMR boundary.

Note that Vite’s HMR does not actually swap the originally imported module: if an HMR boundary module re-exports imports from a dep, then it is responsible for updating those re-exports (and these exports must be using let). In addition, importers up the chain from the boundary module will not be notified of the change.

This simplified HMR implementation is sufficient for most dev use cases, while allowing us to skip the expensive work of generating proxy modules.

A module can also accept updates from direct dependencies without reloading itself:

hot.dispose(cb)

The import.meta.hot.data object is persisted across different instances of the same updated module. It can be used to pass on information from a previous version of the module to the next one.

hot.decline()

Calling import.meta.hot.decline() indicates this module is not hot-updatable, and the browser should perform a full reload if this module is encountered while propagating HMR updates.

For now, calling import.meta.hot.invalidate() simply reloads the page.

hot.on(event, cb)

Listen to a custom HMR event. Custom HMR events can be sent from plugins. See for more details.