feat: route level config

.changeset/chatty-moles-warn.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': minor
+---
+
+feat: support route-level configuration

.changeset/cuddly-rats-decide.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/adapter-vercel': minor
+---
+
+feat: support route-level configuration options

.changeset/fresh-lamps-fetch.md

@@ -0,0 +1,7 @@
+---
+'@sveltejs/adapter-netlify': major
+'@sveltejs/adapter-static': major
+'@sveltejs/adapter-vercel': major
+---
+
+breaking: bump `@sveltejs/kit` peer dependency

documentation/docs/20-core-concepts/40-page-options.md

@@ -125,3 +125,51 @@ export const trailingSlash = 'always';
 This option also affects [prerendering](#prerender). If `trailingSlash` is `always`, a route like `/about` will result in an `about/index.html` file, otherwise it will create `about.html`, mirroring static webserver conventions.
 
 > Ignoring trailing slashes is not recommended — the semantics of relative paths differ between the two cases (`./y` from `/x` is `/y`, but from `/x/` is `/x/y`), and `/x` and `/x/` are treated as separate URLs which is harmful to SEO.
+
+## config
+
+With the concept of [adapters](/docs/adapters), SvelteKit is able to run on a variety of platforms. Each of these might have specific configuration to further tweak the deployment — for example with Vercel or Netlify you could chose to deploy some parts of your app on the edge and others on serverless environments.
+
+`config` is an object with key-value pairs at the top level. Beyond that, the concrete shape is dependent on the adapter you're using. Every adapter should provide a `Config` interface to import for type safety. Consult the documentation of your adapter for more information.
+
+```js
+// @filename: ambient.d.ts
+declare module 'some-adapter' {
+	export interface Config { runtime: string }
+}
+
+// @filename: index.js
+// ---cut---
+/// file: src/routes/+page.js
+/** @type {import('some-adapter').Config} */
+export const config = {
+	runtime: 'edge'
+};
+```
+
+`config` objects are merged at the top level (but _not_ deeper levels). This means you don't need to repeat all the values in a `+page.js` if you want to only override some of the values in the upper `+layout.js`. For example this layout configuration...
+
+```js
+/// file: src/routes/+layout.js
+export const config = {
+	runtime: 'edge',
+	regions: 'all',
+	foo: {
+		bar: true
+	}
+}
+```
+
+...is overridden by this page configuration...
+
+```js
+/// file: src/routes/+page.js
+export const config = {
+	regions: ['us1', 'us2'],
+	foo: {
+		baz: true
+	}
+}
+```
+
+...which results in the config value `{ runtime: 'edge', regions: ['us1', 'us2'], foo: { baz: true } }` for that page.

documentation/docs/25-build-and-deploy/90-adapter-vercel.md

@@ -11,33 +11,65 @@ This adapter will be installed by default when you use [`adapter-auto`](adapter-
 Install with `npm i -D @sveltejs/adapter-vercel`, then add the adapter to your `svelte.config.js`:
 
 ```js
-// @errors: 2307
+// @errors: 2307 2345
 /// file: svelte.config.js
 import adapter from '@sveltejs/adapter-vercel';
 
 export default {
 	kit: {
-		// default options are shown
 		adapter: adapter({
-			// if true, will deploy the app using edge functions
-			// (https://vercel.com/docs/concepts/functions/edge-functions)
-			// rather than serverless functions
-			edge: false,
-
-			// an array of dependencies that esbuild should treat
-			// as external when bundling functions. this only applies
-			// to edge functions, and should only be used to exclude
-			// optional dependencies that will not run outside Node
-			external: [],
-
-			// if true, will split your app into multiple functions
-			// instead of creating a single one for the entire app
-			split: false
+			// see the section on deployment configuration below
+			runtime: 'nodejs18.x',
+			regions: ['iad1'], // if runtime is `edge`, this defaults to `all`
+			memory: 1024,
+			maxDuration: undefined, // 5s for Hobby plans, 15s for Pro, 30s for Enterprise
+			split: false,
+			external: []
 		})
 	}
 };
 ```
 
+## Deployment configuration
+
+To control how your routes are deployed to Vercel as functions, you can specify deployment configuration, either through the `defaultConfig` option shown above or with [`export const config`](/docs/page-options#config) inside `+server.js`, `+page(.server).js` and `+layout(.server).js` files.
+
+For example you could deploy some parts of your app as [Edge Functions](https://vercel.com/docs/concepts/functions/edge-functions)...
+
+```js
+/// file: about/+page.js
+/** @type {import('@sveltejs/adapter-vercel').Config} */
+export const config = {
+	runtime: 'edge'
+};
+```
+
+...and others as [Serverless Functions](https://vercel.com/docs/concepts/functions/serverless-functions) (note that by specifying `config` inside a layout, it applies to all child pages):
+
+```js
+/// file: admin/+layout.js
+/** @type {import('@sveltejs/adapter-vercel').Config} */
+export const config = {
+	runtime: 'nodejs18.x'
+};
+```
+
+The following options apply to all functions:
+
+- `runtime`: `'edge'`, `'nodejs16.x'` or `'nodejs18.x'` (the default)
+- `regions`: an array of [edge network regions](https://vercel.com/docs/concepts/edge-network/regions) (defaulting to `["iad1"]` for serverless functions) or `'all'` if `runtime` is `edge` (its default)
+- `split`: if `true`, causes a route to be deployed as an individual function. If `split` is set to `true` at the adapter level, all routes will be deployed as individual functions
+
+Additionally, the following options apply to edge functions:
+- `envVarsInUse`: an array of environment variables that should be accessible inside the edge function
+- `external`: an array of dependencies that esbuild should treat as external when bundling functions. This should only be used to exclude optional dependencies that will not run outside Node
+
+And the following option apply to serverless functions:
+- `memory`: the amount of memory available to the function. Defaults to `1024` Mb, and can be [increased](https://vercel.com/docs/concepts/limits/overview#serverless-function-memory) up to `3008` on Pro or Enterprise accounts
+- `maxDuration`: maximum execution duration of the function. Defaults to `5` seconds for Hobby accounts, `15` for Pro and `30` for Enterprise
+
+If your functions need to access data in a specific region, it's recommended that they be deployed in the same region (or close to it) for optimal performance.
+
 ## Environment Variables
 
 Vercel makes a set of [deployment-specific environment variables](https://vercel.com/docs/concepts/projects/environment-variables#system-environment-variables) available. Like other environment variables, these are accessible from `$env/static/private` and `$env/dynamic/private` (sometimes — more on that later), and inaccessible from their public counterparts. To access one of these variables from the client:

packages/adapter-netlify/index.js

@@ -162,10 +162,15 @@ async function generate_lambda_functions({ builder, publish, split }) {
 	// Configuring the function to use ESM as the output format.
 	const fn_config = JSON.stringify({ config: { nodeModuleFormat: 'esm' }, version: 1 });
 
+	builder.log.minor('Generating serverless functions...');
+
 	if (split) {
-		builder.log.minor('Generating serverless functions...');
+		const seen = new Set();
+
+		for (let i = 0; i < builder.routes.length; i++) {
+			const route = builder.routes[i];
+			const routes = [route];
 
-		await builder.createEntries((route) => {
 			const parts = [];
 			// Netlify's syntax uses '*' and ':param' as "splats" and "placeholders"
 			// https://docs.netlify.com/routing/redirects/redirect-options/#splats
@@ -183,27 +188,31 @@ async function generate_lambda_functions({ builder, publish, split }) {
 			const pattern = `/${parts.join('/')}`;
 			const name = parts.join('-').replace(/[:.]/g, '_').replace('*', '__rest') || 'index';
 
-			return {
-				id: pattern,
-				filter: (other) => matches(route.segments, other.segments),
-				complete: (entry) => {
-					const manifest = entry.generateManifest({
-						relativePath: '../server'
-					});
+			// skip routes with identical patterns, they were already folded into another function
+			if (seen.has(pattern)) continue;
+			seen.add(pattern);
 
-					const fn = `import { init } from '../serverless.js';\n\nexport const handler = init(${manifest});\n`;
+			// figure out which lower priority routes should be considered fallbacks
+			for (let j = i + 1; j < builder.routes.length; j += 1) {
+				if (matches(route.segments, routes[j].segments)) {
+					routes.push(builder.routes[j]);
+				}
+			}
 
-					writeFileSync(`.netlify/functions-internal/${name}.mjs`, fn);
-					writeFileSync(`.netlify/functions-internal/${name}.json`, fn_config);
+			const manifest = builder.generateManifest({
+				relativePath: '../server',
+				routes
+			});
 
-					redirects.push(`${pattern} /.netlify/functions/${name} 200`);
-					redirects.push(`${pattern}/__data.json /.netlify/functions/${name} 200`);
-				}
-			};
-		});
-	} else {
-		builder.log.minor('Generating serverless functions...');
+			const fn = `import { init } from '../serverless.js';\n\nexport const handler = init(${manifest});\n`;
+
+			writeFileSync(`.netlify/functions-internal/${name}.mjs`, fn);
+			writeFileSync(`.netlify/functions-internal/${name}.json`, fn_config);
 
+			redirects.push(`${pattern} /.netlify/functions/${name} 200`);
+			redirects.push(`${pattern}/__data.json /.netlify/functions/${name} 200`);
+		}
+	} else {
 		const manifest = builder.generateManifest({
 			relativePath: '../server'
 		});

packages/adapter-netlify/package.json

@@ -50,6 +50,6 @@
 		"uvu": "^0.5.6"
 	},
 	"peerDependencies": {
-		"@sveltejs/kit": "^1.0.0"
+		"@sveltejs/kit": "^1.4.0"
 	}
 }

packages/adapter-static/index.js

@@ -8,25 +8,9 @@ export default function (options) {
 
 		async adapt(builder) {
 			if (!options?.fallback) {
-				/** @type {string[]} */
-				const dynamic_routes = [];
-
-				// this is a bit of a hack — it allows us to know whether there are dynamic
-				// (i.e. prerender = false/'auto') routes without having dedicated API
-				// surface area for it
-				builder.createEntries((route) => {
-					dynamic_routes.push(route.id);
-
-					return {
-						id: '',
-						filter: () => false,
-						complete: () => {}
-					};
-				});
-
-				if (dynamic_routes.length > 0 && options?.strict !== false) {
+				if (builder.routes.length > 0 && options?.strict !== false) {
 					const prefix = path.relative('.', builder.config.kit.files.routes);
-					const has_param_routes = dynamic_routes.some((route) => route.includes('['));
+					const has_param_routes = builder.routes.some((route) => route.id.includes('['));
 					const config_option =
 						has_param_routes || JSON.stringify(builder.config.kit.prerender.entries) !== '["*"]'
 							? `  - adjust the \`prerender.entries\` config option ${
@@ -38,7 +22,7 @@ export default function (options) {
 
 					builder.log.error(
 						`@sveltejs/adapter-static: all routes must be fully prerenderable, but found the following routes that are dynamic:
-${dynamic_routes.map((id) => `  - ${path.posix.join(prefix, id)}`).join('\n')}
+${builder.routes.map((route) => `  - ${path.posix.join(prefix, route.id)}`).join('\n')}
 
 You have the following options:
   - set the \`fallback\` option — see https://github.com/sveltejs/kit/tree/master/packages/adapter-static#spa-mode for more info.

packages/adapter-static/package.json

@@ -38,6 +38,6 @@
 		"vite": "^4.0.4"
 	},
 	"peerDependencies": {
-		"@sveltejs/kit": "^1.0.0"
+		"@sveltejs/kit": "^1.4.0"
 	}
 }

packages/adapter-vercel/files/edge.js

@@ -3,7 +3,7 @@ import { manifest } from 'MANIFEST';
 
 const server = new Server(manifest);
 const initialized = server.init({
-	env: process.env
+	env: /** @type {Record<string, string>} */ (process.env)
 });
 
 /**
@@ -13,7 +13,7 @@ export default async (request) => {
 	await initialized;
 	return server.respond(request, {
 		getClientAddress() {
-			return request.headers.get('x-forwarded-for');
+			return /** @type {string} */ (request.headers.get('x-forwarded-for'));
 		}
 	});
 };

packages/adapter-vercel/files/serverless.js

@@ -8,7 +8,7 @@ installPolyfills();
 const server = new Server(manifest);
 
 await server.init({
-	env: process.env
+	env: /** @type {Record<string, string>} */ (process.env)
 });
 
 /**
@@ -22,15 +22,15 @@ export default async (req, res) => {
 	try {
 		request = await getRequest({ base: `https://${req.headers.host}`, request: req });
 	} catch (err) {
-		res.statusCode = err.status || 400;
+		res.statusCode = /** @type {any} */ (err).status || 400;
 		return res.end('Invalid request body');
 	}
 
 	setResponse(
 		res,
 		await server.respond(request, {
 			getClientAddress() {
-				return request.headers.get('x-forwarded-for');
+				return /** @type {string} */ (request.headers.get('x-forwarded-for'));
 			}
 		})
 	);

packages/adapter-vercel/index.d.ts

@@ -1,9 +1,58 @@
 import { Adapter } from '@sveltejs/kit';
 
-type Options = {
-	edge?: boolean;
+export default function plugin(config?: Config): Adapter;
+
+export interface ServerlessConfig {
+	/**
+	 * Whether to use [Edge Functions](https://vercel.com/docs/concepts/functions/edge-functions) or [Serverless Functions](https://vercel.com/docs/concepts/functions/serverless-functions)
+	 * @default 'nodejs18.x'
+	 */
+	runtime?: 'nodejs16.x' | 'nodejs18.x';
+	/**
+	 * To which regions to deploy the app. A list of regions.
+	 * More info: https://vercel.com/docs/concepts/edge-network/regions
+	 */
+	regions?: string[];
+	/**
+	 * Maximum execution duration (in seconds) that will be allowed for the Serverless Function.
+	 * Serverless only.
+	 */
+	maxDuration?: number;
+	/**
+	 * Amount of memory (RAM in MB) that will be allocated to the Serverless Function.
+	 * Serverless only.
+	 */
+	memory?: number;
+	/**
+	 * If `true`, this route will always be deployed as its own separate function
+	 */
+	split?: boolean;
+}
+
+export interface EdgeConfig {
+	/**
+	 * Whether to use [Edge Functions](https://vercel.com/docs/concepts/functions/edge-functions) or [Serverless Functions](https://vercel.com/docs/concepts/functions/serverless-functions)
+	 */
+	runtime?: 'edge';
+	/**
+	 * To which regions to deploy the app. A list of regions or `'all'`.
+	 * More info: https://vercel.com/docs/concepts/edge-network/regions
+	 */
+	regions?: string[] | 'all';
+	/**
+	 * List of environment variable names that will be available for the Edge Function to utilize.
+	 * Edge only.
+	 */
+	envVarsInUse?: string[];
+	/**
+	 * List of packages that should not be bundled into the Edge Function.
+	 * Edge only.
+	 */
 	external?: string[];
+	/**
+	 * If `true`, this route will always be deployed as its own separate function
+	 */
 	split?: boolean;
-};
+}
 
-export default function plugin(options?: Options): Adapter;
+export type Config = EdgeConfig | ServerlessConfig;