"HMR dead end" false positive due to /@id/ prefix

[aleclarson]

⚠️ 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.
• This is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.

Describe the bug

Note: This seems to affect virtual modules only.

vite/packages/vite/src/node/plugins/importAnalysis.ts

Lines 201 to 204 in 4364992

	if (!url.startsWith('.') && !url.startsWith('/')) {
	url =
	VALID_ID_PREFIX + resolved.id.replace('\0', NULL_BYTE_PLACEHOLDER)
	}

In the snippet above, /@id/ is prefixed to bare imports. This "normalized URL" is added to the module's importedUrls set (here), which is then passed to moduleGraph.updateModuleInfo (here). Then a module is created for the /@id/-prefixed bare import (here).

But then in transformRequest, the same bare import is not prefixed with /@id/, which leads to a duplicate module being created (here). This duplicate module won't know which modules it's imported by, which leads to "HMR dead end" false positives (here).

System Info

• vite version: 2.0.5

[sunkehappy]

bare imports like React will be resolved to relative path to root with / prefixed. Check the log in the image:

But still maybe we are not talking the same imports. Could you upload a sample project that could reproduce this bug to GitHub?

[aleclarson]

Here's the repro with instructions
https://github.com/aleclarson/repro/tree/vite-2380

[aleclarson]

By taking the same approach as @vitejs/plugin-react-refresh does with virtual module IDs, I can avoid this issue.

vite/packages/plugin-react-refresh/index.js

Line 5 in 5ec13d8

const runtimePublicPath = '/@react-refresh'

[aleclarson]

One problem with the work around is TypeScript won't let you declare module when the path starts with /.

Ambient module declaration cannot specify relative module name. ts(2436)