Fix cached inline modules (#2038)

* Fix cached inline modules

* Adds a changeset

2 files changed, 17 insertions, 2 deletions

diff --git a/.changeset/little-carrots-sleep.md b/.changeset/little-carrots-sleep.md
new file mode 100644
index 000000000..f4e391540
--- /dev/null
+++ b/.changeset/little-carrots-sleep.md
@@ -0,0 +1,7 @@
+---
+'astro': patch
+---
+
+Fixes dev errors in hydrated components
+
+The errors would occur when there was state changes in hydrated components. This only occurs in dev but does result in the hydrated component not working. This fixes the underlying issue.
diff --git a/packages/astro/vendor/vite/dist/node/chunks/dep-35df7f96.js b/packages/astro/vendor/vite/dist/node/chunks/dep-35df7f96.js
index c709d599e..0a7a5a722 100644
--- a/packages/astro/vendor/vite/dist/node/chunks/dep-35df7f96.js
+++ b/packages/astro/vendor/vite/dist/node/chunks/dep-35df7f96.js
@@ -56982,8 +56982,10 @@ const devHtmlHook = async (html, { path: htmlPath, server, originalUrl }) => {
                     .join('');
                 // add HTML Proxy to Map
                 addToHTMLProxyCache(config, url, scriptModuleIndex, contents);
-                // inline js module. convert to src="proxy"
-                s.overwrite(node.loc.start.offset, node.loc.end.offset, `<script type="module" src="${config.base + url.slice(1)}?html-proxy&index=${scriptModuleIndex}.js"></script>`);
+                const modulePath = `${config.base + htmlPath.slice(1)}?html-proxy&index=${scriptModuleIndex}.js`;
+                // invalidate the module so the newly cached contents will be served
+                server === null || server === void 0 ? void 0 : server.moduleGraph.invalidateId(config.root + modulePath);
+                s.overwrite(node.loc.start.offset, node.loc.end.offset, `<script type="module" src="${modulePath}"></script>`);
             }
         }
         // elements with [href/src] attrs
@@ -57113,6 +57115,12 @@ class ModuleGraph {
         mod.ssrTransformResult = null;
         invalidateSSRModule(mod, seen);
     }
+    invalidateId(id) {
+        const mod = this.idToModuleMap.get(id);
+        if (mod) {
+            this.invalidateModule(mod);
+        }
+    }
     invalidateAll() {
         const seen = new Set();
         this.idToModuleMap.forEach((mod) => {