diff --git a/.changeset/gorgeous-starfishes-serve.md b/.changeset/gorgeous-starfishes-serve.md
new file mode 100644
index 000000000..401ab1eed
--- /dev/null
+++ b/.changeset/gorgeous-starfishes-serve.md
@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Add logging for when JSON.parse fails within hydrate func
diff --git a/packages/astro/src/runtime/server/astro-island.ts b/packages/astro/src/runtime/server/astro-island.ts
index 5887f3149..a108044ac 100644
--- a/packages/astro/src/runtime/server/astro-island.ts
+++ b/packages/astro/src/runtime/server/astro-island.ts
@@ -127,9 +127,29 @@ declare const Astro: {
 						if (!closest?.isSameNode(this)) continue;
 						slots[slot.getAttribute('name') || 'default'] = slot.innerHTML;
 					}
-					const props = this.hasAttribute('props')
-						? JSON.parse(this.getAttribute('props')!, reviver)
-						: {};
+
+					let props: Record<string, unknown>;
+
+					try {
+						props = this.hasAttribute('props')
+							? JSON.parse(this.getAttribute('props')!, reviver)
+							: {};
+					} catch (e) {
+						let componentName: string = this.getAttribute('component-url') || '<unknown>';
+						const componentExport = this.getAttribute('component-export');
+
+						if (componentExport) {
+							componentName += ` (export ${componentExport})`;
+						}
+
+						// eslint-disable-next-line no-console
+						console.error(
+							`[hydrate] Error parsing props for component ${componentName}`,
+							this.getAttribute('props'),
+							e
+						);
+						throw e;
+					}
 					await this.hydrator(this)(this.Component, props, slots, {
 						client: this.getAttribute('client'),
 					});