Implementation in HMR event, 'vite:afterUpdate'

Clear and concise description of the problem

The problem is that I cannot precisely handle HMR events, specifically ‘after update’.

According to rollup.js, there is feature like below:

import.meta.hot.afterUpdate(() => {
   // after update called
}) 

and other bundlers have similar features, such as wepack.addStatus('idle', () => { //... }).

Suggested solution

Abstract implementation is somehow like below:

Add notifyListeners('vite:afterUpdate') after payload.updates.forEach loop ends.

async function handleMessage(payload: HMRPayload) {
  switch (payload.type) {
    case 'update':  
      notifyListeners('vite:beforeUpdate', payload)
      payload.updates.forEach((update) => {
         // ... js and cs updates
      })
     notifyListeners('vite:afterUpdate') // ⭐️  fire events 'vite:afterUpdate'
      break;

Alternative

No response

Additional context

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn’t already an issue that request the same feature to avoid creating a duplicate.

[patak-dev]

@alvarosabu see https://github.com/vitejs/vite/pull/9810, it will be available in Vite 4 (the first alpha is going to be out next week, so you could start using it if you need it before the stable release)

[potty]

For me would be useful to update styles after update, because my app has multiple iframes and I have to keep styles in sync between them manually.