HMR causes modules to be re-evaluated due to circular imports

⚠️ IMPORTANT ⚠️ Please do not ignore this template. If you do, your issue will be closed immediately.

• Read the docs.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it’s a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/vue-next instead.

Describe the bug

In Vite 1, when a module is updated only that module is re-evaluated in the browser.

In Vite 2, when a module is updated all modules that depend on the updated module are invalidated and have their import path updated, causing the browser to re-evaluate the modules if they’re in the dependency tree of the updated module (due to circular dependencies). Marking modules with import.meta.hot.decline() doesn’t appear to make any difference.

Specifically the issue is at https://github.com/vitejs/vite/blob/4396057abd69bf55dfc8976f6feaddf6042031a5/packages/vite/src/node/server/hmr.ts#L237

It would be nice if this behaviour was configurable.

Reproduction

https://github.com/nowylie/vite-2-repro

npm ci
npm run vite

1. Open the repro page in the browser
2. Open the JS console in the dev tools
3. Save src/dep.js to trigger a HMR update
4. Note that main.js is re-evaluated

System Info

• vite version: 2.0.4
• Operating System: macOS 11.2
• Node version: 14.16.0
• Package manager (npm/yarn/pnpm) and version: npm 6.14.11

[anncwb]

@anncwb no solution yet.

As I mentioned, our circular dependencies are by design.

For accidental/unnecessary circular dependencies, I’ve had success in the past using madge to track them down.

I reopened an issue, wait to see the author’s reply

[nowylie]

@anncwb no solution yet.

As I mentioned, our circular dependencies are by design.

For accidental/unnecessary circular dependencies, I’ve had success in the past using madge to track them down.