fix: resolve client manifest imports against Vite root

.changeset/fix-client-manifest-vite-root.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': patch
+---
+
+fix: resolve client manifest imports against the Vite root

packages/kit/src/core/sync/sync.js

@@ -31,7 +31,7 @@ export function create(config, root) {
 
 	const output = path.join(config.outDir, 'generated');
 
-	write_client_manifest(config, manifest_data, `${output}/client`);
+	write_client_manifest(config, manifest_data, `${output}/client`, root);
 	write_server(config, output, root);
 	write_all_types(config, manifest_data, root);
 	write_app_types(config, manifest_data, root);

packages/kit/src/core/sync/sync.spec.js

@@ -2,7 +2,37 @@ import fs from 'node:fs';
 import os from 'node:os';
 import path from 'node:path';
 import { expect, test } from 'vitest';
-import { update } from './sync.js';
+import { process_config, validate_config } from '../config/index.js';
+import { relative_path } from '../../utils/filesystem.js';
+import { create, update } from './sync.js';
+
+test('generates client manifest imports relative to the project root', () => {
+	const root = fs.mkdtempSync(path.join(os.tmpdir(), 'svelte-kit-sync-'));
+	const component = path.join(root, 'src/routes/+page.svelte');
+
+	fs.mkdirSync(path.dirname(component), { recursive: true });
+	fs.writeFileSync(component, '');
+	fs.writeFileSync(
+		path.join(root, 'src/app.html'),
+		'<!doctype html><html><head>%sveltekit.head%</head><body>%sveltekit.body%</body></html>'
+	);
+
+	try {
+		const config = process_config(validate_config({}), root);
+		const { manifest_data } = create(config, root);
+		const index = manifest_data.nodes.findIndex(
+			(node) => node.component === 'src/routes/+page.svelte'
+		);
+		const output = path.join(config.outDir, 'generated/client');
+		const generated = fs.readFileSync(path.join(output, `nodes/${index}.js`), 'utf8');
+
+		expect(generated).toBe(
+			`export { default as component } from ${JSON.stringify(relative_path(`${output}/nodes`, component))};`
+		);
+	} finally {
+		fs.rmSync(root, { recursive: true, force: true });
+	}
+});
 
 test('requests a manifest rebuild if static analysis encounters a missing route file', () => {
 	const manifest_data = /** @type {import('types').ManifestData} */ ({

packages/kit/src/core/sync/write_client_manifest.js

@@ -1,3 +1,4 @@
+import path from 'node:path';
 import { check_spelling, dedent, write_if_changed } from './utils.js';
 import { relative_path, resolve_entry } from '../../utils/filesystem.js';
 import { s } from '../../utils/misc.js';
@@ -8,9 +9,10 @@ import { s } from '../../utils/misc.js';
  * @param {import('types').ValidatedConfig} kit
  * @param {import('types').ManifestData} manifest_data
  * @param {string} output
+ * @param {string} root The project root directory
  * @param {import('types').ServerMetadata['nodes']} [metadata] If this is omitted, we have to assume that all routes with a `+layout/page.server.js` file have a server load function
  */
-export function write_client_manifest(kit, manifest_data, output, metadata) {
+export function write_client_manifest(kit, manifest_data, output, root, metadata) {
 	const client_routing = kit.router.resolution === 'client';
 
 	/**
@@ -22,15 +24,15 @@ export function write_client_manifest(kit, manifest_data, output, metadata) {
 
 		if (node.universal) {
 			declarations.push(
-				`import * as universal from ${s(relative_path(`${output}/nodes`, node.universal))};`,
+				`import * as universal from ${s(relative_path(`${output}/nodes`, path.resolve(root, node.universal)))};`,
 				'export { universal };'
 			);
 		}
 
 		if (node.component) {
 			declarations.push(
 				`export { default as component } from ${s(
-					relative_path(`${output}/nodes`, node.component)
+					relative_path(`${output}/nodes`, path.resolve(root, node.component))
 				)};`
 			);
 		}
@@ -180,7 +182,7 @@ export function write_client_manifest(kit, manifest_data, output, metadata) {
 		const module =
 			!manifest_data.params || !uses_matchers
 				? 'export const matchers = {};'
-				: `import { params as matchers } from ${s(relative_path(output, manifest_data.params))};\n\nexport { matchers };`;
+				: `import { params as matchers } from ${s(relative_path(output, path.resolve(root, manifest_data.params)))};\n\nexport { matchers };`;
 
 		write_if_changed(`${output}/matchers.js`, module);
 	}

packages/kit/src/exports/vite/index.js

@@ -1779,6 +1779,7 @@ function kit({ svelte_config }) {
 						kit,
 						manifest_data,
 						`${out_dir}/generated/client-optimized`,
+						root,
 						build_metadata.nodes
 					);