addVitePlugin usage blocks Vite HMR fully

[TechAkayy]

Environment

npx nuxi info

---

• Operating System: Darwin
• Node Version: v21.1.0
• Nuxt Version: 3.11.2
• CLI Version: 3.11.1
• Nitro Version: 2.9.6
• Package Manager: [email protected]
• Builder: -
• User Config: hooks
• Runtime Modules: -
• Build Modules: -

---

Reproduction

https://github.com/TechAkayy/nuxt-3110

• Clone & install deps. It contains this inline module that uses addVitePlugin in nuxt.config.ts.
• Start dev-server, check browser log, vite connection is never established for HMR.
• Try uncommenting the div in app.vue, HMR doesn't apply.

import {addVitePlugin} from '@nuxt/kit'

export default defineNuxtConfig({
  modules: [
    function (inlineOptions, nuxt) {
      addVitePlugin({
        name: 'live-designer',
        config: (config, {command, mode}) => {
          return config
        },
      })
    },
  ],
})

Additional context

Thanks for looking into this. If you require any more info, please let m eknow.

Logs

No response

[TechAkayy]

After a lot of trial and error, I have figured out where the issue is:

Nuxt's HMR is getting blocked when, in the custom vite plugin's "config" hook, either the original config object (after mutating it) or a mergedConfig is returned. Vite docs seems to support this return in the config hook.

This HMR break is specific to Nuxt, as HMR is not blocked in a plain Vue project with the same custom vite plugin .

This breaks Nuxt's HMR (returns a merged config)

And after some very long timeout (couple of minutes), this gets logged

This doesn't break HMR (avoids mergeConfig and directly mutates the config)

I have updated my Vite plugin to directly mutate instead returning a config using mergeConfig vite utility. The above is just an example, I do make few other config updates, hence used mergeConfig.

Even though this is solved at my end, why Nuxt's HMR is blocked when using mergeConfig utility and returning a merged config is still a mystery, unless Im not supposed to do this way.

Maintainers, please feel free to close this if you see no action on this issue. Thanks for looking into this.

[TechAkayy]

Updated reproduction to latest (3.13.0) using npx nuxi upgrade --force, and removed vue & vue-router from package.json as they not required to be added explicitly anymore. HMR works nicely 😃 !

Issue doesn't seem to reoccur anymore. Thanks @pi0 @danielroe.