@sveltejs/kit 1.8.7 → 1.9.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sveltejs/kit",
-  "version": "1.8.7",
+  "version": "1.9.0",
   "repository": {
     "type": "git",
     "url": "https://github.com/sveltejs/kit",

package/src/core/adapt/builder.js

@@ -43,14 +43,15 @@ export function create_builder({
 	 * we expose a stable type that adapters can use to group/filter routes
 	 */
 	const routes = route_data.map((route) => {
-		const methods =
-			/** @type {import('types').HttpMethod[]} */
-			(server_metadata.routes.get(route.id)?.methods);
-		const config = server_metadata.routes.get(route.id)?.config;
+		const { config, methods, page, api } = /** @type {import('types').ServerMetadataRoute} */ (
+			server_metadata.routes.get(route.id)
+		);
 
 		/** @type {import('types').RouteDefinition} */
 		const facade = {
 			id: route.id,
+			api,
+			page,
 			segments: get_route_segments(route.id).map((segment) => ({
 				dynamic: segment.includes('['),
 				rest: segment.includes('[...'),

package/src/core/config/options.js

@@ -171,6 +171,13 @@ const options = object(
 						}
 					}
 
+					return input;
+				}),
+				relative: validate(undefined, (input, keypath) => {
+					if (typeof input !== 'boolean') {
+						throw new Error(`${keypath} option must be a boolean or undefined`);
+					}
+
 					return input;
 				})
 			}),

package/src/core/postbuild/analyse.js

@@ -62,8 +62,11 @@ async function analyse({ manifest_path, env }) {
 
 	// analyse routes
 	for (const route of manifest._.routes) {
-		/** @type {Set<import('types').HttpMethod>} */
-		const methods = new Set();
+		/** @type {Array<'GET' | 'POST'>} */
+		const page_methods = [];
+
+		/** @type {import('types').HttpMethod[]} */
+		const api_methods = [];
 
 		/** @type {import('types').PrerenderOption | undefined} */
 		let prerender = undefined;
@@ -84,12 +87,12 @@ async function analyse({ manifest_path, env }) {
 				prerender = mod.prerender;
 			}
 
-			if (mod.GET) methods.add('GET');
-			if (mod.POST) methods.add('POST');
-			if (mod.PUT) methods.add('PUT');
-			if (mod.PATCH) methods.add('PATCH');
-			if (mod.DELETE) methods.add('DELETE');
-			if (mod.OPTIONS) methods.add('OPTIONS');
+			if (mod.GET) api_methods.push('GET');
+			if (mod.POST) api_methods.push('POST');
+			if (mod.PUT) api_methods.push('PUT');
+			if (mod.PATCH) api_methods.push('PATCH');
+			if (mod.DELETE) api_methods.push('DELETE');
+			if (mod.OPTIONS) api_methods.push('OPTIONS');
 
 			config = mod.config;
 		}
@@ -112,8 +115,8 @@ async function analyse({ manifest_path, env }) {
 			}
 
 			if (page) {
-				methods.add('GET');
-				if (page.server?.actions) methods.add('POST');
+				page_methods.push('GET');
+				if (page.server?.actions) page_methods.push('POST');
 
 				validate_page_server_exports(page.server, page.server_id);
 				validate_common_exports(page.universal, page.universal_id);
@@ -133,9 +136,15 @@ async function analyse({ manifest_path, env }) {
 		}
 
 		metadata.routes.set(route.id, {
-			prerender,
 			config,
-			methods: Array.from(methods)
+			methods: Array.from(new Set([...page_methods, ...api_methods])),
+			page: {
+				methods: page_methods
+			},
+			api: {
+				methods: api_methods
+			},
+			prerender
 		});
 	}
 

package/src/core/sync/write_server.js

@@ -27,7 +27,8 @@ const server_template = ({
 }) => `
 import root from '../root.svelte';
 import { set_building } from '__sveltekit/environment';
-import { set_assets, set_private_env, set_public_env } from '${runtime_directory}/shared-server.js';
+import { set_assets } from '__sveltekit/paths';
+import { set_private_env, set_public_env } from '${runtime_directory}/shared-server.js';
 
 export const options = {
 	app_template_contains_nonce: ${template.includes('%sveltekit.nonce%')},

package/src/exports/vite/dev/index.js

@@ -451,15 +451,14 @@ export async function dev(vite, vite_config, svelte_config) {
 					await vite.ssrLoadModule(`${runtime_base}/server/index.js`)
 				);
 
-				const { set_assets, set_fix_stack_trace } =
-					/** @type {import('types').ServerInternalModule} */ (
-						await vite.ssrLoadModule(`${runtime_base}/shared-server.js`)
-					);
+				const { set_fix_stack_trace } = await vite.ssrLoadModule(
+					`${runtime_base}/shared-server.js`
+				);
+				set_fix_stack_trace(fix_stack_trace);
 
+				const { set_assets } = await vite.ssrLoadModule('__sveltekit/paths');
 				set_assets(assets);
 
-				set_fix_stack_trace(fix_stack_trace);
-
 				const server = new Server(manifest);
 
 				await server.init({ env });

package/src/exports/vite/index.js

@@ -218,21 +218,6 @@ function kit({ svelte_config }) {
 
 			const generated = path.posix.join(kit.outDir, 'generated');
 
-			// This ensures that esm-env is inlined into the server output with the
-			// export conditions resolved correctly through Vite. This prevents adapters
-			// that bundle later on from resolving the export conditions incorrectly
-			// and for example include browser-only code in the server output
-			// because they for example use esbuild.build with `platform: 'browser'`
-			const noExternal = ['esm-env'];
-
-			// Vitest bypasses Vite when loading external modules, so we bundle
-			// when it is detected to keep our virtual modules working.
-			// See https://github.com/sveltejs/kit/pull/9172
-			// and https://vitest.dev/config/#deps-registernodeloader
-			if (process.env.TEST) {
-				noExternal.push('@sveltejs/kit');
-			}
-
 			// dev and preview config can be shared
 			/** @type {import('vite').UserConfig} */
 			const new_config = {
@@ -269,7 +254,23 @@ function kit({ svelte_config }) {
 					]
 				},
 				ssr: {
-					noExternal
+					noExternal: [
+						// This ensures that esm-env is inlined into the server output with the
+						// export conditions resolved correctly through Vite. This prevents adapters
+						// that bundle later on from resolving the export conditions incorrectly
+						// and for example include browser-only code in the server output
+						// because they for example use esbuild.build with `platform: 'browser'`
+						'esm-env',
+						// We need this for two reasons:
+						// 1. Without this, `@sveltejs/kit` imports are kept as-is in the server output,
+						//    and that causes modules and therefore classes like `Redirect` to be imported twice
+						//    under different IDs, which breaks a bunch of stuff because of failing instanceof checks.
+						// 2. Vitest bypasses Vite when loading external modules, so we bundle
+						//    when it is detected to keep our virtual modules working.
+						//    See https://github.com/sveltejs/kit/pull/9172
+						//    and https://vitest.dev/config/#deps-registernodeloader
+						'@sveltejs/kit'
+					]
 				}
 			};
 
@@ -378,17 +379,34 @@ function kit({ svelte_config }) {
 				case '\0__sveltekit/paths':
 					const { assets, base } = svelte_config.kit.paths;
 
+					// use the values defined in `global`, but fall back to hard-coded values
+					// for the sake of things like Vitest which may import this module
+					// outside the context of a page
 					if (browser) {
-						return `export const base = ${s(base)};
-export const assets = ${global}.assets;`;
+						return `export const base = ${global}?.base ?? ${s(base)};
+export const assets = ${global}?.assets ?? ${assets ? s(assets) : 'base'};`;
 					}
 
-					return `export const base = ${s(base)};
+					return `export let base = ${s(base)};
 export let assets = ${assets ? s(assets) : 'base'};
 
+export const relative = ${svelte_config.kit.paths.relative};
+
+const initial = { base, assets };
+
+export function override(paths) {
+	base = paths.base;
+	assets = paths.assets;
+}
+
+export function reset() {
+	base = initial.base;
+	assets = initial.assets;
+}
+
 /** @param {string} path */
 export function set_assets(path) {
-	assets = path;
+	assets = initial.assets = path;
 }`;
 
 				case '\0__sveltekit/environment':

package/src/internal.d.ts

@@ -7,7 +7,10 @@ declare module '__sveltekit/environment' {
 
 /** Internal version of $app/paths */
 declare module '__sveltekit/paths' {
-	export const base: `/${string}`;
-	export let assets: `https://${string}` | `http://${string}`;
+	export let base: '' | `/${string}`;
+	export let assets: '' | `https://${string}` | `http://${string}` | '/_svelte_kit_assets';
+	export let relative: boolean | undefined; // TODO in 2.0, make this a `boolean` that defaults to `true`
+	export function reset(): void;
+	export function override(paths: { base: string; assets: string }): void;
 	export function set_assets(path: string): void;
 }

package/src/runtime/app/stores.js

@@ -66,7 +66,8 @@ function get_store(name) {
 		return getStores()[name];
 	} catch (e) {
 		throw new Error(
-			`Cannot subscribe to '${name}' store on the server outside of a Svelte component, as it is bound to the current request via component context. This prevents state from leaking between users.`
+			`Cannot subscribe to '${name}' store on the server outside of a Svelte component, as it is bound to the current request via component context. This prevents state from leaking between users.` +
+				'For more information, see https://kit.svelte.dev/docs/state-management#avoid-shared-state-on-the-server'
 		);
 	}
 }

package/src/runtime/server/page/render.js

@@ -1,7 +1,7 @@
 import * as devalue from 'devalue';
 import { readable, writable } from 'svelte/store';
 import { DEV } from 'esm-env';
-import { assets, base } from '__sveltekit/paths';
+import * as paths from '__sveltekit/paths';
 import { hash } from '../../hash.js';
 import { serialize_data } from './serialize_data.js';
 import { s } from '../../../utils/misc.js';
@@ -11,6 +11,7 @@ import { clarify_devalue_error, stringify_uses, handle_error_and_jsonify } from
 import { public_env } from '../../shared-server.js';
 import { text } from '../../../exports/index.js';
 import { create_async_iterator } from '../../../utils/streaming.js';
+import { SVELTE_KIT_ASSETS } from '../../../constants.js';
 
 // TODO rename this function/module
 
@@ -80,6 +81,43 @@ export async function render_response({
 			? action_result.data ?? null
 			: null;
 
+	/** @type {string} */
+	let base = paths.base;
+
+	/** @type {string} */
+	let assets = paths.assets;
+
+	/**
+	 * An expression that will evaluate in the client to determine the resolved base path.
+	 * We use a relative path when possible to support IPFS, the internet archive, etc.
+	 */
+	let base_expression = s(paths.base);
+
+	// if appropriate, use relative paths for greater portability
+	if (paths.relative !== false && !state.prerendering?.fallback) {
+		const segments = event.url.pathname.slice(paths.base.length).split('/');
+
+		if (segments.length === 1 && paths.base !== '') {
+			// if we're on `/my-base-path`, relative links need to start `./my-base-path` rather than `.`
+			base = `./${paths.base.split('/').at(-1)}`;
+
+			base_expression = `new URL(${s(base)}, location).pathname`;
+		} else {
+			base =
+				segments
+					.slice(2)
+					.map(() => '..')
+					.join('/') || '.';
+
+			// resolve e.g. '../..' against current location, then remove trailing slash
+			base_expression = `new URL(${s(base)}, location).pathname.slice(0, -1)`;
+		}
+
+		if (!paths.assets || (paths.assets[0] === '/' && paths.assets !== SVELTE_KIT_ASSETS)) {
+			assets = base;
+		}
+	}
+
 	if (page_config.ssr) {
 		if (__SVELTEKIT_DEV__ && !branch.at(-1)?.node.component) {
 			// Can only be the leaf, layouts have a fallback component generated
@@ -116,6 +154,10 @@ export async function render_response({
 			form: form_value
 		};
 
+		// use relative paths during rendering, so that the resulting HTML is as
+		// portable as possible, but reset afterwards
+		if (paths.relative) paths.override({ base, assets });
+
 		if (__SVELTEKIT_DEV__) {
 			const fetch = globalThis.fetch;
 			let warned = false;
@@ -138,9 +180,14 @@ export async function render_response({
 				rendered = options.root.render(props);
 			} finally {
 				globalThis.fetch = fetch;
+				paths.reset();
 			}
 		} else {
-			rendered = options.root.render(props);
+			try {
+				rendered = options.root.render(props);
+			} finally {
+				paths.reset();
+			}
 		}
 
 		for (const { node } of branch) {
@@ -156,35 +203,6 @@ export async function render_response({
 		rendered = { head: '', html: '', css: { code: '', map: null } };
 	}
 
-	/**
-	 * The prefix to use for static assets. Replaces `%sveltekit.assets%` in the template
-	 * @type {string}
-	 */
-	let resolved_assets;
-
-	/**
-	 * An expression that will evaluate in the client to determine the resolved asset path
-	 */
-	let asset_expression;
-
-	if (assets) {
-		// if an asset path is specified, use it
-		resolved_assets = assets;
-		asset_expression = s(assets);
-	} else if (state.prerendering?.fallback) {
-		// if we're creating a fallback page, asset paths need to be root-relative
-		resolved_assets = base;
-		asset_expression = s(base);
-	} else {
-		// otherwise we want asset paths to be relative to the page, so that they
-		// will work in odd contexts like IPFS, the internet archive, and so on
-		const segments = event.url.pathname.slice(base.length).split('/').slice(2);
-		resolved_assets = segments.length > 0 ? segments.map(() => '..').join('/') : '.';
-		asset_expression = `new URL(${s(
-			resolved_assets
-		)}, location.href).pathname.replace(/^\\\/$/, '')`;
-	}
-
 	let head = '';
 	let body = rendered.html;
 
@@ -198,9 +216,9 @@ export async function render_response({
 			// Vite makes the start script available through the base path and without it.
 			// We load it via the base path in order to support remote IDE environments which proxy
 			// all URLs under the base path during development.
-			return base + path;
+			return paths.base + path;
 		}
-		return `${resolved_assets}/${path}`;
+		return `${assets}/${path}`;
 	};
 
 	if (inline_styles.size > 0) {
@@ -286,9 +304,10 @@ export async function render_response({
 
 		const properties = [
 			`env: ${s(public_env)}`,
-			`assets: ${asset_expression}`,
+			paths.assets && `assets: ${s(paths.assets)}`,
+			`base: ${base_expression}`,
 			`element: document.currentScript.parentElement`
-		];
+		].filter(Boolean);
 
 		if (chunks) {
 			blocks.push(`const deferred = new Map();`);
@@ -419,7 +438,7 @@ export async function render_response({
 	const html = options.templates.app({
 		head,
 		body,
-		assets: resolved_assets,
+		assets,
 		nonce: /** @type {string} */ (csp.nonce),
 		env: public_env
 	});

package/src/runtime/shared-server.js

@@ -1,5 +1,3 @@
-export { set_assets } from '__sveltekit/paths';
-
 /** @type {Record<string, string>} */
 export let private_env = {};
 

package/types/ambient.d.ts

@@ -195,7 +195,7 @@ declare module '$app/navigation' {
 			 */
 			state?: any;
 			/**
-			 * If `true`, all `load` functions of the page will be rerun. See https://kit.svelte.dev/docs/load#invalidation for more info on invalidation.
+			 * If `true`, all `load` functions of the page will be rerun. See https://kit.svelte.dev/docs/load#rerunning-load-functions for more info on invalidation.
 			 */
 			invalidateAll?: boolean;
 		}

package/types/index.d.ts

@@ -441,12 +441,20 @@ export interface KitConfig {
 		 * An absolute path that your app's files are served from. This is useful if your files are served from a storage bucket of some kind.
 		 * @default ""
 		 */
-		assets?: string;
+		assets?: '' | `http://${string}` | `https://${string}`;
 		/**
 		 * A root-relative path that must start, but not end with `/` (e.g. `/base-path`), unless it is the empty string. This specifies where your app is served from and allows the app to live on a non-root path. Note that you need to prepend all your root-relative links with the base value or they will point to the root of your domain, not your `base` (this is how the browser works). You can use [`base` from `$app/paths`](/docs/modules#$app-paths-base) for that: `<a href="{base}/your-page">Link</a>`. If you find yourself writing this often, it may make sense to extract this into a reusable component.
 		 * @default ""
 		 */
-		base?: string;
+		base?: '' | `/${string}`;
+		/**
+		 * Whether to use relative asset paths. By default, if `paths.assets` is not external, SvelteKit will replace `%sveltekit.assets%` with a relative path and use relative paths to reference build artifacts, but `base` and `assets` imported from `$app/paths` will be as specified in your config.
+		 *
+		 * If `true`, `base` and `assets` imported from `$app/paths` will be replaced with relative asset paths during server-side rendering, resulting in portable HTML.
+		 * If `false`, `%sveltekit.assets%` and references to build artifacts will always be root-relative paths, unless `paths.assets` is an external URL
+		 * @default undefined
+		 */
+		relative?: boolean | undefined;
 	};
 	/**
 	 * See [Prerendering](https://kit.svelte.dev/docs/page-options#prerender).
@@ -906,7 +914,7 @@ export interface RequestEvent<
 	 */
 	locals: App.Locals;
 	/**
-	 * The parameters of the current page or endpoint - e.g. for a route like `/blog/[slug]`, a `{ slug: string }` object
+	 * The parameters of the current route - e.g. for a route like `/blog/[slug]`, a `{ slug: string }` object
 	 */
 	params: Params;
 	/**
@@ -950,7 +958,7 @@ export interface RequestEvent<
 	 */
 	setHeaders(headers: Record<string, string>): void;
 	/**
-	 * The URL of the current page or endpoint.
+	 * The requested URL.
 	 */
 	url: URL;
 	/**
@@ -997,6 +1005,12 @@ export interface ResolveOptions {
 
 export interface RouteDefinition<Config = any> {
 	id: string;
+	api: {
+		methods: HttpMethod[];
+	};
+	page: {
+		methods: Extract<HttpMethod, 'GET' | 'POST'>[];
+	};
 	pattern: RegExp;
 	prerender: PrerenderOption;
 	segments: RouteSegment[];

package/types/internal.d.ts

@@ -254,16 +254,21 @@ export interface ServerErrorNode {
 	status?: number;
 }
 
+export interface ServerMetadataRoute {
+	config: any;
+	api: {
+		methods: HttpMethod[];
+	};
+	page: {
+		methods: Array<'GET' | 'POST'>;
+	};
+	methods: HttpMethod[];
+	prerender: PrerenderOption | undefined;
+}
+
 export interface ServerMetadata {
 	nodes: Array<{ has_server_load: boolean }>;
-	routes: Map<
-		string,
-		{
-			prerender: PrerenderOption | undefined;
-			methods: HttpMethod[];
-			config: any;
-		}
-	>;
+	routes: Map<string, ServerMetadataRoute>;
 }
 
 export interface SSRComponent {