fix(hmr): HMR regression related to .astro updates (#2681)

withastro · Feb 28, 2022 · 046af36 · 046af36
1 parent bfaff25
commit 046af36
Show file tree

Hide file tree

Showing 6 changed files with 24 additions and 7 deletions.
diff --git a/.changeset/thin-birds-rescue.md b/.changeset/thin-birds-rescue.md
@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Fix HMR regression related to fine-grained `.astro` HMR. This fixes HMR for Tailwind and CSS styles when `.astro` files are edited.
diff --git a/packages/astro/package.json b/packages/astro/package.json
@@ -85,7 +85,7 @@
     "htmlparser2": "^7.1.2",
     "kleur": "^4.1.4",
     "magic-string": "^0.25.7",
-    "micromorph": "^0.0.2",
+    "micromorph": "^0.1.1",
     "mime": "^3.0.0",
     "parse5": "^6.0.1",
     "path-to-regexp": "^6.2.0",

diff --git a/packages/astro/src/runtime/client/hmr.ts b/packages/astro/src/runtime/client/hmr.ts
@@ -1,4 +1,6 @@
 if (import.meta.hot) {
+	// signal to Vite that we accept HMR
+	import.meta.hot.accept((mod) => mod);
 	const parser = new DOMParser();
 	import.meta.hot.on('astro:update', async ({ file }) => {
 		const { default: diff } = await import('micromorph');

diff --git a/packages/astro/src/vite-plugin-astro/hmr.ts b/packages/astro/src/vite-plugin-astro/hmr.ts
@@ -55,6 +55,12 @@ export function handleHotUpdate(ctx: HmrContext, config: AstroConfig, logging: L
 	const filtered = new Set<ModuleNode>(ctx.modules);
 	const files = new Set<string>();
 	for (const mod of ctx.modules) {
+		// This is always the HMR script, we skip it to avoid spamming
+		// the browser console with HMR updates about this file
+		if (mod.id?.endsWith('.astro?html-proxy&index=0.js')) {
+			filtered.delete(mod);
+			continue;
+		}
 		if (mod.file && isCached(config, mod.file)) {
 			filtered.add(mod);
 			files.add(mod.file);
@@ -77,7 +83,6 @@ export function handleHotUpdate(ctx: HmrContext, config: AstroConfig, logging: L
 		const file = ctx.file.replace(config.projectRoot.pathname, '/');
 		logger.info('astro', green('hmr'), `${file}`);
 		ctx.server.ws.send({ type: 'custom', event: 'astro:update', data: { file } });
-		return [];
 	}
 
 	return Array.from(filtered);

diff --git a/packages/astro/src/vite-plugin-astro/index.ts b/packages/astro/src/vite-plugin-astro/index.ts
@@ -34,6 +34,7 @@ export default function astro({ config, logging }: AstroPluginOptions): vite.Plu
 		return slash(fileURLToPath(url)) + url.search;
 	}
 
+	let isProduction: boolean;
 	let viteTransform: TransformHook;
 	let viteDevServer: vite.ViteDevServer | null = null;
 
@@ -46,6 +47,7 @@ export default function astro({ config, logging }: AstroPluginOptions): vite.Plu
 		enforce: 'pre', // run transforms before other plugins can
 		configResolved(resolvedConfig) {
 			viteTransform = getViteTransform(resolvedConfig);
+			isProduction = resolvedConfig.isProduction;
 		},
 		configureServer(server) {
 			viteDevServer = server;
@@ -140,8 +142,11 @@ export default function astro({ config, logging }: AstroPluginOptions): vite.Plu
 					sourcefile: id,
 				});
 
+				// Signal to Vite that we accept HMR updates
+				const SUFFIX = isProduction ? '' : `\nif (import.meta.hot) import.meta.hot.accept((mod) => mod);`;
+
 				return {
-					code,
+					code: `${code}${SUFFIX}`,
 					map,
 				};
 			} catch (err: any) {

diff --git a/yarn.lock b/yarn.lock
@@ -5867,10 +5867,10 @@ micromatch@^4.0.2, micromatch@^4.0.4:
     braces "^3.0.1"
     picomatch "^2.2.3"
 
-micromorph@^0.0.2:
-  version "0.0.2"
-  resolved "https://registry.yarnpkg.com/micromorph/-/micromorph-0.0.2.tgz#5cfbaea66ae5fb8629c8041897e88d9e827afc2f"
-  integrity sha512-hfy/OA8rtwI/vPRm4L6a3/u6uDvqsPmTok7pPmtfv2a7YfaTVfxd9HX2Kdn/SZ8rGMKkKVJ9A0WcBnzs0bjLXw==
+micromorph@^0.1.1:
+  version "0.1.1"
+  resolved "https://registry.yarnpkg.com/micromorph/-/micromorph-0.1.1.tgz#1772b07f1be6cae10b3210a0f84fe5364987f029"
+  integrity sha512-VIAYxW6D9yOkcMJK/G6xS1fh8r1gD+mmD4VLPKki7Xqzfrq1qlCfQAA6ITIbUnLDAHv8UpPPhCWzFJ29fiUjZQ==
 
 mime@1.6.0:
   version "1.6.0"