From 33a8fad10217ee40afb18d94ea66a32a7b570f60 Mon Sep 17 00:00:00 2001
From: gtmnayan <50981692+gtm-nayan@users.noreply.github.com>
Date: Wed, 1 Feb 2023 22:55:34 +0545
Subject: [PATCH] fix: avoid suppressing errors when loading pages for ssr
 fails (#8813)

* fix: output errors if pages fail to compile

* stupid javascript try catch syntax

* changeset

* less blatant copy paste, more code reuse

* use superior casing and wrap a few more places

* why did I change this
---
 .changeset/curly-jobs-switch.md            |  5 +++++
 packages/kit/src/exports/vite/dev/index.js | 22 ++++++++++++++++++----
 2 files changed, 23 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/curly-jobs-switch.md

diff --git a/.changeset/curly-jobs-switch.md b/.changeset/curly-jobs-switch.md
new file mode 100644
index 000000000000..5ee118ded700
--- /dev/null
+++ b/.changeset/curly-jobs-switch.md
@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': patch
+---
+
+fix: output errors properly if pages fail to compile
diff --git a/packages/kit/src/exports/vite/dev/index.js b/packages/kit/src/exports/vite/dev/index.js
index 0c59327c1c40..927bc921a5f8 100644
--- a/packages/kit/src/exports/vite/dev/index.js
+++ b/packages/kit/src/exports/vite/dev/index.js
@@ -3,7 +3,7 @@ import path from 'node:path';
 import { URL } from 'node:url';
 import colors from 'kleur';
 import sirv from 'sirv';
-import { isCSSRequest, loadEnv } from 'vite';
+import { isCSSRequest, loadEnv, buildErrorMessage } from 'vite';
 import { getRequest, setResponse } from '../../../exports/node/index.js';
 import { installPolyfills } from '../../../exports/node/polyfills.js';
 import { coalesce_to_error } from '../../../utils/error.js';
@@ -50,11 +50,25 @@ export async function dev(vite, vite_config, svelte_config) {
 	/** @type {Error | null} */
 	let manifest_error = null;
 
+	/** @param {string} url */
+	async function loud_ssr_load_module(url) {
+		try {
+			return await vite.ssrLoadModule(url);
+		} catch (/** @type {any} */ err) {
+			const msg = buildErrorMessage(err, [colors.red(`Internal server error: ${err.message}`)]);
+
+			vite.config.logger.error(msg, { error: err });
+			vite.ws.send({ type: 'error', err: err });
+
+			throw err;
+		}
+	}
+
 	/** @param {string} id */
 	async function resolve(id) {
 		const url = id.startsWith('..') ? `/@fs${path.posix.resolve(id)}` : `/${id}`;
 
-		const module = await vite.ssrLoadModule(url);
+		const module = await loud_ssr_load_module(url);
 
 		const module_node = await vite.moduleGraph.getModuleByUrl(url);
 		if (!module_node) throw new Error(`Could not find node for ${url}`);
@@ -161,7 +175,7 @@ export async function dev(vite, vite_config, svelte_config) {
 									(query.has('svelte') && query.get('type') === 'style')
 								) {
 									try {
-										const mod = await vite.ssrLoadModule(dep.url);
+										const mod = await loud_ssr_load_module(dep.url);
 										styles[dep.url] = mod.default;
 									} catch {
 										// this can happen with dynamically imported modules, I think
@@ -191,7 +205,7 @@ export async function dev(vite, vite_config, svelte_config) {
 							endpoint: endpoint
 								? async () => {
 										const url = path.resolve(cwd, endpoint.file);
-										return await vite.ssrLoadModule(url);
+										return await loud_ssr_load_module(url);
 								  }
 								: null,
 							endpoint_id: endpoint?.file