@sveltejs/kit 1.0.0-next.577 → 1.0.0-next.579

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sveltejs/kit",
-  "version": "1.0.0-next.577",
+  "version": "1.0.0-next.579",
   "repository": {
     "type": "git",
     "url": "https://github.com/sveltejs/kit",
@@ -10,7 +10,7 @@
   "homepage": "https://kit.svelte.dev",
   "type": "module",
   "dependencies": {
-    "@sveltejs/vite-plugin-svelte": "^1.3.1",
+    "@sveltejs/vite-plugin-svelte": "^2.0.0",
     "@types/cookie": "^0.5.1",
     "cookie": "^0.5.0",
     "devalue": "^4.2.0",
@@ -32,16 +32,16 @@
     "@types/sade": "^1.7.4",
     "@types/set-cookie-parser": "^2.4.2",
     "marked": "^4.2.3",
-    "rollup": "^2.79.1",
-    "svelte": "^3.53.1",
+    "rollup": "^3.7.0",
+    "svelte": "^3.54.0",
     "svelte-preprocess": "^4.10.7",
     "typescript": "^4.9.3",
     "uvu": "^0.5.6",
-    "vite": "^3.2.4"
+    "vite": "^4.0.0"
   },
   "peerDependencies": {
-    "svelte": "^3.44.0",
-    "vite": "^3.2.0"
+    "svelte": "^3.54.0",
+    "vite": "^4.0.0"
   },
   "bin": {
     "svelte-kit": "svelte-kit.js"

package/src/core/adapt/builder.js

@@ -1,11 +1,14 @@
+import { existsSync, statSync, createReadStream, createWriteStream } from 'node:fs';
+import { pipeline } from 'node:stream';
+import { promisify } from 'node:util';
+import { fork } from 'node:child_process';
+import { fileURLToPath } from 'node:url';
 import glob from 'tiny-glob';
 import zlib from 'zlib';
-import { existsSync, statSync, createReadStream, createWriteStream } from 'fs';
-import { pipeline } from 'stream';
-import { promisify } from 'util';
 import { copy, rimraf, mkdirp } from '../../utils/filesystem.js';
 import { generate_manifest } from '../generate_manifest/index.js';
 import { get_route_segments } from '../../utils/routing.js';
+import { get_env } from '../../exports/vite/utils.js';
 
 const pipe = promisify(pipeline);
 
@@ -104,6 +107,33 @@ export function create_builder({ config, build_data, routes, prerendered, log })
 			}
 		},
 
+		generateFallback(dest) {
+			// do prerendering in a subprocess so any dangling stuff gets killed upon completion
+			const script = fileURLToPath(new URL('../prerender/fallback.js', import.meta.url));
+
+			const manifest_path = `${config.kit.outDir}/output/server/manifest-full.js`;
+
+			const env = get_env(config.kit.env, 'production');
+
+			return new Promise((fulfil, reject) => {
+				const child = fork(
+					script,
+					[dest, manifest_path, JSON.stringify({ ...env.private, ...env.public })],
+					{
+						stdio: 'inherit'
+					}
+				);
+
+				child.on('exit', (code) => {
+					if (code) {
+						reject(new Error(`Could not create a fallback page — failed with code ${code}`));
+					} else {
+						fulfil(undefined);
+					}
+				});
+			});
+		},
+
 		generateManifest: ({ relativePath }) => {
 			return generate_manifest({
 				build_data,
@@ -132,16 +162,17 @@ export function create_builder({ config, build_data, routes, prerendered, log })
 			return [...copy(`${config.kit.outDir}/output/client`, dest)];
 		},
 
-		writePrerendered(dest, { fallback } = {}) {
-			const source = `${config.kit.outDir}/output/prerendered`;
-			const files = [...copy(`${source}/pages`, dest), ...copy(`${source}/dependencies`, dest)];
-
-			if (fallback) {
-				files.push(fallback);
-				copy(`${source}/fallback.html`, `${dest}/${fallback}`);
+		// @ts-expect-error
+		writePrerendered(dest, opts) {
+			// TODO remove for 1.0
+			if (opts?.fallback) {
+				throw new Error(
+					'The fallback option no longer exists — use builder.generateFallback(fallback) instead'
+				);
 			}
 
-			return files;
+			const source = `${config.kit.outDir}/output/prerendered`;
+			return [...copy(`${source}/pages`, dest), ...copy(`${source}/dependencies`, dest)];
 		},
 
 		writeServer(dest) {

package/src/core/prerender/fallback.js

@@ -0,0 +1,43 @@
+import { readFileSync, writeFileSync } from 'fs';
+import { dirname, join } from 'path';
+import { pathToFileURL } from 'url';
+import { mkdirp } from '../../utils/filesystem.js';
+import { installPolyfills } from '../../exports/node/polyfills.js';
+import { load_config } from '../config/index.js';
+
+const [, , dest, manifest_path, env] = process.argv;
+
+/** @type {import('types').ValidatedKitConfig} */
+const config = (await load_config()).kit;
+
+installPolyfills();
+
+const server_root = join(config.outDir, 'output');
+
+/** @type {import('types').ServerModule} */
+const { Server, override } = await import(pathToFileURL(`${server_root}/server/index.js`).href);
+
+/** @type {import('types').SSRManifest} */
+const manifest = (await import(pathToFileURL(manifest_path).href)).manifest;
+
+override({
+	building: true,
+	paths: config.paths,
+	read: (file) => readFileSync(join(config.files.assets, file))
+});
+
+const server = new Server(manifest);
+await server.init({ env: JSON.parse(env) });
+
+const rendered = await server.respond(new Request(config.prerender.origin + '/[fallback]'), {
+	getClientAddress: () => {
+		throw new Error('Cannot read clientAddress during prerendering');
+	},
+	prerendering: {
+		fallback: true,
+		dependencies: new Map()
+	}
+});
+
+mkdirp(dirname(dest));
+writeFileSync(dest, await rendered.text());

package/src/core/prerender/prerender.js

@@ -453,18 +453,6 @@ export async function prerender() {
 		);
 	}
 
-	const rendered = await server.respond(new Request(config.prerender.origin + '/[fallback]'), {
-		getClientAddress,
-		prerendering: {
-			fallback: true,
-			dependencies: new Map()
-		}
-	});
-
-	const file = `${config.outDir}/output/prerendered/fallback.html`;
-	mkdirp(dirname(file));
-	writeFileSync(file, await rendered.text());
-
 	output_and_exit({ prerendered, prerender_map });
 }
 

package/src/exports/index.js

@@ -1,4 +1,4 @@
-import { HttpError, Redirect, ValidationError } from '../runtime/control.js';
+import { HttpError, Redirect, ActionFailure } from '../runtime/control.js';
 
 // For some reason we need to type the params as well here,
 // JSdoc doesn't seem to like @type with function overloads
@@ -46,10 +46,15 @@ export function json(data, init) {
 }
 
 /**
- * Generates a `ValidationError` object.
+ * Generates an `ActionFailure` object.
  * @param {number} status
  * @param {Record<string, any> | undefined} [data]
  */
-export function invalid(status, data) {
-	return new ValidationError(status, data);
+export function fail(status, data) {
+	return new ActionFailure(status, data);
+}
+
+// TODO remove for 1.0
+export function invalid() {
+	throw new Error('invalid(...) is now fail(...)');
 }

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

@@ -3,6 +3,7 @@ import colors from 'kleur';
 import path from 'path';
 import sirv from 'sirv';
 import { URL } from 'url';
+import { isCSSRequest } 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';
@@ -12,10 +13,7 @@ import { SVELTE_KIT_ASSETS } from '../../../constants.js';
 import * as sync from '../../../core/sync/sync.js';
 import { get_mime_lookup, runtime_base, runtime_prefix } from '../../../core/utils.js';
 import { compact } from '../../../utils/array.js';
-
-// Vite doesn't expose this so we just copy the list for now
-// https://github.com/vitejs/vite/blob/3edd1af56e980aef56641a5a51cf2932bb580d41/packages/vite/src/node/plugins/css.ts#L96
-const style_pattern = /\.(css|less|sass|scss|styl|stylus|pcss|postcss)$/;
+import { not_found } from '../utils.js';
 
 const cwd = process.cwd();
 
@@ -131,7 +129,7 @@ export async function dev(vite, vite_config, svelte_config) {
 								const query = parsed.searchParams;
 
 								if (
-									style_pattern.test(dep.file) ||
+									isCSSRequest(dep.file) ||
 									(query.has('svelte') && query.get('type') === 'style')
 								) {
 									try {
@@ -327,10 +325,7 @@ export async function dev(vite, vite_config, svelte_config) {
 				}
 
 				if (!decoded.startsWith(svelte_config.kit.paths.base)) {
-					return not_found(
-						res,
-						`Not found (did you mean ${svelte_config.kit.paths.base + req.url}?)`
-					);
+					return not_found(req, res, svelte_config.kit.paths.base);
 				}
 
 				if (decoded === svelte_config.kit.paths.base + '/service-worker.js') {
@@ -531,21 +526,11 @@ export async function dev(vite, vite_config, svelte_config) {
 	};
 }
 
-/** @param {import('http').ServerResponse} res */
-function not_found(res, message = 'Not found') {
-	res.statusCode = 404;
-	res.end(message);
-}
-
 /**
  * @param {import('connect').Server} server
  */
 function remove_static_middlewares(server) {
-	// We don't use viteServePublicMiddleware because of the following issues:
-	// https://github.com/vitejs/vite/issues/9260
-	// https://github.com/vitejs/vite/issues/9236
-	// https://github.com/vitejs/vite/issues/9234
-	const static_middlewares = ['viteServePublicMiddleware', 'viteServeStaticMiddleware'];
+	const static_middlewares = ['viteServeStaticMiddleware'];
 	for (let i = server.stack.length - 1; i > 0; i--) {
 		// @ts-expect-error using internals
 		if (static_middlewares.includes(server.stack[i].handle.name)) {

package/src/exports/vite/index.js

@@ -583,7 +583,7 @@ function kit({ svelte_config }) {
 
 function check_vite_version() {
 	// TODO parse from kit peer deps and maybe do a full semver compare if we ever require feature releases a min
-	const min_required_vite_major = 3;
+	const min_required_vite_major = 4;
 	const vite_version = vite.version ?? '2.x'; // vite started exporting it's version in 3.0
 	const current_vite_major = parseInt(vite_version.split('.')[0], 10);
 

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

@@ -6,6 +6,7 @@ import { getRequest, setResponse } from '../../../exports/node/index.js';
 import { installPolyfills } from '../../../exports/node/polyfills.js';
 import { SVELTE_KIT_ASSETS } from '../../../constants.js';
 import { loadEnv, normalizePath } from 'vite';
+import { not_found } from '../utils.js';
 
 /** @typedef {import('http').IncomingMessage} Req */
 /** @typedef {import('http').ServerResponse} Res */
@@ -73,7 +74,7 @@ export async function preview(vite, vite_config, svelte_config) {
 				next();
 			} else {
 				res.statusCode = 404;
-				res.end(`Not found (did you mean ${base + pathname}?)`);
+				not_found(req, res, base);
 			}
 		});
 

package/src/exports/vite/utils.js

@@ -2,6 +2,7 @@ import path from 'path';
 import { loadConfigFromFile, loadEnv, mergeConfig } from 'vite';
 import { runtime_directory } from '../../core/utils.js';
 import { posixify } from '../../utils/filesystem.js';
+import { negotiate } from '../../utils/http.js';
 
 /**
  * @param {import('vite').ResolvedConfig} config
@@ -149,3 +150,31 @@ export function get_env(env_config, mode) {
 		private: Object.fromEntries(entries.filter(([k]) => !k.startsWith(env_config.publicPrefix)))
 	};
 }
+
+/**
+ * @param {import('http').IncomingMessage} req
+ * @param {import('http').ServerResponse} res
+ * @param {string} base
+ */
+export function not_found(req, res, base) {
+	const type = negotiate(req.headers.accept ?? '*', ['text/plain', 'text/html']);
+
+	// special case — handle `/` request automatically
+	if (req.url === '/' && type === 'text/html') {
+		res.statusCode = 307;
+		res.setHeader('location', base);
+		res.end();
+		return;
+	}
+
+	res.statusCode = 404;
+
+	const prefixed = base + req.url;
+
+	if (type === 'text/html') {
+		res.setHeader('Content-Type', 'text/html');
+		res.end(`Not found (did you mean <a href="${prefixed}">${prefixed}</a>?)`);
+	} else {
+		res.end(`Not found (did you mean ${prefixed}?)`);
+	}
+}

package/src/runtime/app/forms.js

@@ -47,7 +47,7 @@ export function enhance(form, submit = () => {}) {
 			await invalidateAll();
 		}
 
-		// For success/invalid results, only apply action if it belongs to the
+		// For success/failure results, only apply action if it belongs to the
 		// current page, otherwise `form` will be updated erroneously
 		if (
 			location.origin + location.pathname === action.origin + action.pathname ||

package/src/runtime/client/client.js

@@ -592,6 +592,7 @@ export function create_client({ target, base }) {
 					uses.url = true;
 				}),
 				async fetch(resource, init) {
+					/** @type {URL | string} */
 					let requested;
 
 					if (resource instanceof Request) {

package/src/runtime/client/fetcher.js

@@ -41,9 +41,7 @@ if (import.meta.env.DEV) {
 		const method = input instanceof Request ? input.method : init?.method || 'GET';
 
 		if (method !== 'GET') {
-			const url = new URL(input instanceof Request ? input.url : input.toString(), document.baseURI)
-				.href;
-			cache.delete(url);
+			cache.delete(build_selector(input));
 		}
 
 		return native_fetch(input, init);
@@ -53,9 +51,7 @@ if (import.meta.env.DEV) {
 		const method = input instanceof Request ? input.method : init?.method || 'GET';
 
 		if (method !== 'GET') {
-			const url = new URL(input instanceof Request ? input.url : input.toString(), document.baseURI)
-				.href;
-			cache.delete(url);
+			cache.delete(build_selector(input));
 		}
 
 		return native_fetch(input, init);
@@ -67,7 +63,7 @@ const cache = new Map();
 /**
  * Should be called on the initial run of load functions that hydrate the page.
  * Saves any requests with cache-control max-age to the cache.
- * @param {RequestInfo | URL} resource
+ * @param {URL | string} resource
  * @param {RequestInit} [opts]
  */
 export function initial_fetch(resource, opts) {
@@ -88,7 +84,7 @@ export function initial_fetch(resource, opts) {
 
 /**
  * Tries to get the response from the cache, if max-age allows it, else does a fetch.
- * @param {RequestInfo | URL} resource
+ * @param {URL | string} resource
  * @param {string} resolved
  * @param {RequestInit} [opts]
  */
@@ -97,7 +93,11 @@ export function subsequent_fetch(resource, resolved, opts) {
 		const selector = build_selector(resource, opts);
 		const cached = cache.get(selector);
 		if (cached) {
-			if (performance.now() < cached.ttl) {
+			// https://developer.mozilla.org/en-US/docs/Web/API/Request/cache#value
+			if (
+				performance.now() < cached.ttl &&
+				['default', 'force-cache', 'only-if-cached', undefined].includes(opts?.cache)
+			) {
 				return new Response(cached.body, cached.init);
 			}
 
@@ -110,7 +110,7 @@ export function subsequent_fetch(resource, resolved, opts) {
 
 /**
  * Build the cache key for a given request
- * @param {RequestInfo | URL} resource
+ * @param {URL | RequestInfo} resource
  * @param {RequestInit} [opts]
  */
 function build_selector(resource, opts) {

package/src/runtime/control.js

@@ -33,7 +33,7 @@ export class Redirect {
 /**
  * @template {Record<string, unknown> | undefined} [T=undefined]
  */
-export class ValidationError {
+export class ActionFailure {
 	/**
 	 * @param {number} status
 	 * @param {T} [data]

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

@@ -2,7 +2,7 @@ import * as devalue from 'devalue';
 import { error, json } from '../../../exports/index.js';
 import { normalize_error } from '../../../utils/error.js';
 import { is_form_content_type, negotiate } from '../../../utils/http.js';
-import { HttpError, Redirect, ValidationError } from '../../control.js';
+import { HttpError, Redirect, ActionFailure } from '../../control.js';
 import { handle_error_and_jsonify } from '../utils.js';
 
 /** @param {import('types').RequestEvent} event */
@@ -50,9 +50,9 @@ export async function handle_action_json_request(event, options, server) {
 	try {
 		const data = await call_action(event, actions);
 
-		if (data instanceof ValidationError) {
+		if (data instanceof ActionFailure) {
 			return action_json({
-				type: 'invalid',
+				type: 'failure',
 				status: data.status,
 				// @ts-expect-error we assign a string to what is supposed to be an object. That's ok
 				// because we don't use the object outside, and this way we have better code navigation
@@ -81,7 +81,7 @@ export async function handle_action_json_request(event, options, server) {
 		return action_json(
 			{
 				type: 'error',
-				error: await handle_error_and_jsonify(event, options, check_incorrect_invalid_use(error))
+				error: await handle_error_and_jsonify(event, options, check_incorrect_fail_use(error))
 			},
 			{
 				status: error instanceof HttpError ? error.status : 500
@@ -93,9 +93,9 @@ export async function handle_action_json_request(event, options, server) {
 /**
  * @param {HttpError | Error} error
  */
-function check_incorrect_invalid_use(error) {
-	return error instanceof ValidationError
-		? new Error(`Cannot "throw invalid()". Use "return invalid()"`)
+function check_incorrect_fail_use(error) {
+	return error instanceof ActionFailure
+		? new Error(`Cannot "throw fail()". Use "return fail()"`)
 		: error;
 }
 
@@ -142,8 +142,8 @@ export async function handle_action_request(event, server) {
 	try {
 		const data = await call_action(event, actions);
 
-		if (data instanceof ValidationError) {
-			return { type: 'invalid', status: data.status, data: data.data };
+		if (data instanceof ActionFailure) {
+			return { type: 'failure', status: data.status, data: data.data };
 		} else {
 			return {
 				type: 'success',
@@ -164,7 +164,7 @@ export async function handle_action_request(event, server) {
 
 		return {
 			type: 'error',
-			error: check_incorrect_invalid_use(error)
+			error: check_incorrect_fail_use(error)
 		};
 	}
 }
@@ -183,7 +183,7 @@ function check_named_default_separate(actions) {
 /**
  * @param {import('types').RequestEvent} event
  * @param {NonNullable<import('types').SSRNode['server']['actions']>} actions
- * @throws {Redirect | ValidationError | HttpError | Error}
+ * @throws {Redirect | ActionFailure | HttpError | Error}
  */
 export async function call_action(event, actions) {
 	const url = new URL(event.request.url);

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

@@ -68,7 +68,7 @@ export async function render_page(event, route, page, options, state, resolve_op
 				const error = action_result.error;
 				status = error instanceof HttpError ? error.status : 500;
 			}
-			if (action_result?.type === 'invalid') {
+			if (action_result?.type === 'failure') {
 				status = action_result.status;
 			}
 		}

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

@@ -67,7 +67,7 @@ export async function render_response({
 	let rendered;
 
 	const form_value =
-		action_result?.type === 'success' || action_result?.type === 'invalid'
+		action_result?.type === 'success' || action_result?.type === 'failure'
 			? action_result.data ?? null
 			: null;
 

package/types/index.d.ts

@@ -61,7 +61,7 @@ type OptionalUnion<
 	A extends keyof U = U extends U ? keyof U : never
 > = U extends unknown ? { [P in Exclude<A, keyof U>]?: never } & U : never;
 
-type UnpackValidationError<T> = T extends ValidationError<infer X>
+type UnpackValidationError<T> = T extends ActionFailure<infer X>
 	? X
 	: T extends void
 	? undefined // needs to be undefined, because void will corrupt union type
@@ -90,6 +90,11 @@ export interface Builder {
 	 */
 	createEntries(fn: (route: RouteDefinition) => AdapterEntry): Promise<void>;
 
+	/**
+	 * Generate a fallback page for a static webserver to use when no route is matched. Useful for single-page apps.
+	 */
+	generateFallback(dest: string): Promise<void>;
+
 	/**
 	 * Generate a server-side manifest to initialise the SvelteKit [server](https://kit.svelte.dev/docs/types#public-types-server) with.
 	 * @param opts a relative path to the base directory of the app and optionally in which format (esm or cjs) the manifest should be generated
@@ -117,15 +122,9 @@ export interface Builder {
 	/**
 	 * Write prerendered files to `dest`.
 	 * @param dest the destination folder
-	 * @param opts.fallback the name of a file for fallback responses, like `200.html` or `404.html` depending on where the app is deployed
 	 * @returns an array of files written to `dest`
 	 */
-	writePrerendered(
-		dest: string,
-		opts?: {
-			fallback?: string;
-		}
-	): string[];
+	writePrerendered(dest: string): string[];
 	/**
 	 * Write server-side code to `dest`.
 	 * @param dest the destination folder
@@ -1074,7 +1073,7 @@ export type ActionResult<
 	Invalid extends Record<string, unknown> | undefined = Record<string, any>
 > =
 	| { type: 'success'; status: number; data?: Success }
-	| { type: 'invalid'; status: number; data?: Invalid }
+	| { type: 'failure'; status: number; data?: Invalid }
 	| { type: 'redirect'; status: number; location: string }
 	| { type: 'error'; error: any };
 
@@ -1129,17 +1128,17 @@ export interface Redirect {
 export function json(data: any, init?: ResponseInit): Response;
 
 /**
- * Create a `ValidationError` object.
+ * Create an `ActionFailure` object.
  */
-export function invalid<T extends Record<string, unknown> | undefined>(
+export function fail<T extends Record<string, unknown> | undefined>(
 	status: number,
 	data?: T
-): ValidationError<T>;
+): ActionFailure<T>;
 
 /**
- * The object returned by the [`invalid`](https://kit.svelte.dev/docs/modules#sveltejs-kit-invalid) function
+ * The object returned by the [`fail`](https://kit.svelte.dev/docs/modules#sveltejs-kit-fail) function
  */
-export interface ValidationError<T extends Record<string, unknown> | undefined = undefined>
+export interface ActionFailure<T extends Record<string, unknown> | undefined = undefined>
 	extends UniqueInterface {
 	status: number;
 	data: T;