diff --git a/packages/vite/src/node/plugins/css.ts b/packages/vite/src/node/plugins/css.ts index 1a145f4b592efd..1903736bc8c310 100644 --- a/packages/vite/src/node/plugins/css.ts +++ b/packages/vite/src/node/plugins/css.ts @@ -24,7 +24,7 @@ import { } from 'rollup' import { dataToEsm } from '@rollup/pluginutils' import chalk from 'chalk' -import { CLIENT_PUBLIC_PATH } from '../constants' +import { CLIENT_PUBLIC_PATH, FS_PREFIX } from '../constants' import { ResolveFn, ViteDevServer } from '../' import { getAssetFilename, @@ -191,9 +191,23 @@ export function cssPlugin(config: ResolvedConfig): Plugin { if (deps) { // record deps in the module graph so edits to @import css can trigger // main import to hot update + const depModules = new Set( - [...deps].map((file) => moduleGraph.createFileOnlyEntry(file)) + await Promise.all( + [...deps].map(async (file) => { + if (cssLangRE.test(file)) { + return moduleGraph.createFileOnlyEntry(file) + } + + const url = file.startsWith(config.root) + ? file.slice(config.root.length) + : path.posix.join(FS_PREFIX, file) + + return await moduleGraph.ensureEntryFromUrl(url) + }) + ) ) + moduleGraph.updateModuleInfo( thisModule, depModules, diff --git a/packages/vite/src/node/server/moduleGraph.ts b/packages/vite/src/node/server/moduleGraph.ts index 7d0aa602821cf3..ff9c1c85256652 100644 --- a/packages/vite/src/node/server/moduleGraph.ts +++ b/packages/vite/src/node/server/moduleGraph.ts @@ -141,7 +141,7 @@ export class ModuleGraph { async ensureEntryFromUrl(rawUrl: string): Promise { const [url, resolvedId] = await this.resolveUrl(rawUrl) - let mod = this.urlToModuleMap.get(url) || this.idToModuleMap.get(resolvedId) + let mod = this.urlToModuleMap.get(url) if (!mod) { mod = new ModuleNode(url)