@sveltejs/kit 1.0.0-next.99 → 1.0.0

package/src/exports/vite/build/build_server.js

@@ -0,0 +1,359 @@
+import fs from 'fs';
+import path from 'path';
+import { mergeConfig } from 'vite';
+import { mkdirp, posixify, resolve_entry } from '../../../utils/filesystem.js';
+import { get_vite_config } from '../utils.js';
+import { load_error_page, load_template } from '../../../core/config/index.js';
+import { runtime_directory } from '../../../core/utils.js';
+import {
+	create_build,
+	find_deps,
+	get_default_build_config,
+	is_http_method,
+	resolve_symlinks
+} from './utils.js';
+import { s } from '../../../utils/misc.js';
+
+/**
+ * @param {{
+ *   hooks: string;
+ *   config: import('types').ValidatedConfig;
+ *   has_service_worker: boolean;
+ *   runtime: string;
+ *   template: string;
+ *   error_page: string;
+ * }} opts
+ */
+const server_template = ({ config, hooks, has_service_worker, runtime, template, error_page }) => `
+import root from '__GENERATED__/root.svelte';
+import { respond } from '${runtime}/server/index.js';
+import { set_paths, assets, base } from '${runtime}/paths.js';
+import { set_building, set_version } from '${runtime}/env.js';
+import { set_private_env } from '${runtime}/env-private.js';
+import { set_public_env } from '${runtime}/env-public.js';
+
+const app_template = ({ head, body, assets, nonce }) => ${s(template)
+	.replace('%sveltekit.head%', '" + head + "')
+	.replace('%sveltekit.body%', '" + body + "')
+	.replace(/%sveltekit\.assets%/g, '" + assets + "')
+	.replace(/%sveltekit\.nonce%/g, '" + nonce + "')};
+
+const error_template = ({ status, message }) => ${s(error_page)
+	.replace(/%sveltekit\.status%/g, '" + status + "')
+	.replace(/%sveltekit\.error\.message%/g, '" + message + "')};
+
+let read = null;
+
+set_paths(${s(config.kit.paths)});
+set_version(${s(config.kit.version.name)});
+
+let default_protocol = 'https';
+
+// allow paths to be globally overridden
+// in svelte-kit preview and in prerendering
+export function override(settings) {
+	default_protocol = settings.protocol || default_protocol;
+	set_paths(settings.paths);
+	set_building(settings.building);
+	read = settings.read;
+}
+
+export class Server {
+	constructor(manifest) {
+		this.options = {
+			csp: ${s(config.kit.csp)},
+			csrf: {
+				check_origin: ${s(config.kit.csrf.checkOrigin)},
+			},
+			dev: false,
+			embedded: ${config.kit.embedded},
+			handle_error: (error, event) => {
+				return this.options.hooks.handleError({ error, event }) ?? {
+					message: event.route.id != null ? 'Internal Error' : 'Not Found'
+				};
+			},
+			hooks: null,
+			manifest,
+			paths: { base, assets },
+			public_env: {},
+			read,
+			root,
+			service_worker: ${has_service_worker},
+			app_template,
+			app_template_contains_nonce: ${template.includes('%sveltekit.nonce%')},
+			error_template,
+			version: ${s(config.kit.version.name)}
+		};
+	}
+
+	/**
+	 * Take care: Some adapters may have to call \`Server.init\` per-request to set env vars,
+	 * so anything that shouldn't be rerun should be wrapped in an \`if\` block to make sure it hasn't
+	 * been done already.
+	 */
+	async init({ env }) {
+		const entries = Object.entries(env);
+
+		const prv = Object.fromEntries(entries.filter(([k]) => !k.startsWith('${
+			config.kit.env.publicPrefix
+		}')));
+
+		const pub = Object.fromEntries(entries.filter(([k]) => k.startsWith('${
+			config.kit.env.publicPrefix
+		}')));
+
+		set_private_env(prv);
+		set_public_env(pub);
+
+		this.options.public_env = pub;
+
+		if (!this.options.hooks) {
+			const module = await import(${s(hooks)});
+
+			this.options.hooks = {
+				handle: module.handle || (({ event, resolve }) => resolve(event)),
+				handleError: module.handleError || (({ error }) => console.error(error.stack)),
+				handleFetch: module.handleFetch || (({ request, fetch }) => fetch(request))
+			};
+		}
+	}
+
+	async respond(request, options = {}) {
+		if (!(request instanceof Request)) {
+			throw new Error('The first argument to server.respond must be a Request object. See https://github.com/sveltejs/kit/pull/3384 for details');
+		}
+
+		return respond(request, this.options, options);
+	}
+}
+`;
+
+/**
+ * @param {{
+ *   cwd: string;
+ *   config: import('types').ValidatedConfig;
+ *   vite_config: import('vite').ResolvedConfig;
+ *   vite_config_env: import('vite').ConfigEnv;
+ *   manifest_data: import('types').ManifestData;
+ *   build_dir: string;
+ *   output_dir: string;
+ *   service_worker_entry_file: string | null;
+ * }} options
+ * @param {{ vite_manifest: import('vite').Manifest, assets: import('rollup').OutputAsset[] }} client
+ */
+export async function build_server(options, client) {
+	const {
+		cwd,
+		config,
+		vite_config,
+		vite_config_env,
+		manifest_data,
+		build_dir,
+		output_dir,
+		service_worker_entry_file
+	} = options;
+
+	let hooks_file = resolve_entry(config.kit.files.hooks.server);
+
+	if (!hooks_file || !fs.existsSync(hooks_file)) {
+		hooks_file = path.join(config.kit.outDir, 'build/hooks.js');
+		fs.writeFileSync(hooks_file, '');
+	}
+
+	/** @type {Record<string, string>} */
+	const input = {
+		index: `${build_dir}/index.js`
+	};
+
+	// add entry points for every endpoint...
+	manifest_data.routes.forEach((route) => {
+		if (route.endpoint) {
+			const resolved = path.resolve(cwd, route.endpoint.file);
+			const relative = decodeURIComponent(path.relative(config.kit.files.routes, resolved));
+			const name = posixify(path.join('entries/endpoints', relative.replace(/\.js$/, '')));
+			input[name] = resolved;
+		}
+	});
+
+	// ...and every component used by pages...
+	manifest_data.nodes.forEach((node) => {
+		for (const file of [node.component, node.universal, node.server]) {
+			if (file) {
+				const resolved = path.resolve(cwd, file);
+				const relative = decodeURIComponent(path.relative(config.kit.files.routes, resolved));
+
+				const name = relative.startsWith('..')
+					? posixify(path.join('entries/fallbacks', path.basename(file)))
+					: posixify(path.join('entries/pages', relative.replace(/\.js$/, '')));
+				input[name] = resolved;
+			}
+		}
+	});
+
+	// ...and every matcher
+	Object.entries(manifest_data.matchers).forEach(([key, file]) => {
+		const name = posixify(path.join('entries/matchers', key));
+		input[name] = path.resolve(cwd, file);
+	});
+
+	/** @type {(file: string) => string} */
+	const app_relative = (file) => {
+		const relative_file = path.relative(build_dir, path.resolve(cwd, file));
+		return relative_file[0] === '.' ? relative_file : `./${relative_file}`;
+	};
+
+	fs.writeFileSync(
+		input.index,
+		server_template({
+			config,
+			hooks: app_relative(hooks_file),
+			has_service_worker: config.kit.serviceWorker.register && !!service_worker_entry_file,
+			runtime: posixify(path.relative(build_dir, runtime_directory)),
+			template: load_template(cwd, config),
+			error_page: load_error_page(config)
+		})
+	);
+
+	const merged_config = mergeConfig(
+		get_default_build_config({ config, input, ssr: true, outDir: `${output_dir}/server` }),
+		await get_vite_config(vite_config, vite_config_env)
+	);
+
+	const { chunks } = await create_build(merged_config);
+
+	/** @type {import('vite').Manifest} */
+	const vite_manifest = JSON.parse(
+		fs.readFileSync(`${output_dir}/server/${vite_config.build.manifest}`, 'utf-8')
+	);
+
+	mkdirp(`${output_dir}/server/nodes`);
+	mkdirp(`${output_dir}/server/stylesheets`);
+
+	const stylesheet_lookup = new Map();
+
+	client.assets.forEach((asset) => {
+		if (asset.fileName.endsWith('.css')) {
+			if (asset.source.length < config.kit.inlineStyleThreshold) {
+				const index = stylesheet_lookup.size;
+				const file = `${output_dir}/server/stylesheets/${index}.js`;
+
+				fs.writeFileSync(file, `// ${asset.fileName}\nexport default ${s(asset.source)};`);
+				stylesheet_lookup.set(asset.fileName, index);
+			}
+		}
+	});
+
+	manifest_data.nodes.forEach((node, i) => {
+		/** @type {string[]} */
+		const imports = [];
+
+		// String representation of
+		/** @type {import('types').SSRNode} */
+		/** @type {string[]} */
+		const exports = [`export const index = ${i};`];
+
+		/** @type {string[]} */
+		const imported = [];
+
+		/** @type {string[]} */
+		const stylesheets = [];
+
+		/** @type {string[]} */
+		const fonts = [];
+
+		if (node.component) {
+			const entry = find_deps(client.vite_manifest, node.component, true);
+
+			imported.push(...entry.imports);
+			stylesheets.push(...entry.stylesheets);
+			fonts.push(...entry.fonts);
+
+			exports.push(
+				`export const component = async () => (await import('../${
+					resolve_symlinks(vite_manifest, node.component).chunk.file
+				}')).default;`,
+				`export const file = '${entry.file}';` // TODO what is this?
+			);
+		}
+
+		if (node.universal) {
+			const entry = find_deps(client.vite_manifest, node.universal, true);
+
+			imported.push(...entry.imports);
+			stylesheets.push(...entry.stylesheets);
+			fonts.push(...entry.fonts);
+
+			imports.push(`import * as universal from '../${vite_manifest[node.universal].file}';`);
+			exports.push(`export { universal };`);
+		}
+
+		if (node.server) {
+			imports.push(`import * as server from '../${vite_manifest[node.server].file}';`);
+			exports.push(`export { server };`);
+		}
+
+		exports.push(
+			`export const imports = ${s(imported)};`,
+			`export const stylesheets = ${s(stylesheets)};`,
+			`export const fonts = ${s(fonts)};`
+		);
+
+		/** @type {string[]} */
+		const styles = [];
+
+		stylesheets.forEach((file) => {
+			if (stylesheet_lookup.has(file)) {
+				const index = stylesheet_lookup.get(file);
+				const name = `stylesheet_${index}`;
+				imports.push(`import ${name} from '../stylesheets/${index}.js';`);
+				styles.push(`\t${s(file)}: ${name}`);
+			}
+		});
+
+		if (styles.length > 0) {
+			exports.push(`export const inline_styles = () => ({\n${styles.join(',\n')}\n});`);
+		}
+
+		const out = `${output_dir}/server/nodes/${i}.js`;
+		fs.writeFileSync(out, `${imports.join('\n')}\n\n${exports.join('\n')}\n`);
+	});
+
+	return {
+		chunks,
+		vite_manifest,
+		methods: get_methods(cwd, chunks, manifest_data)
+	};
+}
+
+/**
+ * @param {string} cwd
+ * @param {import('rollup').OutputChunk[]} output
+ * @param {import('types').ManifestData} manifest_data
+ */
+function get_methods(cwd, output, manifest_data) {
+	/** @type {Record<string, string[]>} */
+	const lookup = {};
+	output.forEach((chunk) => {
+		if (!chunk.facadeModuleId) return;
+		const id = posixify(path.relative(cwd, chunk.facadeModuleId));
+		lookup[id] = chunk.exports;
+	});
+
+	/** @type {Record<string, import('types').HttpMethod[]>} */
+	const methods = {};
+	manifest_data.routes.forEach((route) => {
+		if (route.endpoint) {
+			if (lookup[route.endpoint.file]) {
+				methods[route.endpoint.file] = lookup[route.endpoint.file].filter(is_http_method);
+			}
+		}
+
+		if (route.leaf?.server) {
+			if (lookup[route.leaf.server]) {
+				methods[route.leaf.server] = lookup[route.leaf.server].filter(is_http_method);
+			}
+		}
+	});
+
+	return methods;
+}

package/src/exports/vite/build/build_service_worker.js

@@ -0,0 +1,85 @@
+import fs from 'fs';
+import * as vite from 'vite';
+import { s } from '../../../utils/misc.js';
+import { get_config_aliases } from '../utils.js';
+import { assets_base } from './utils.js';
+
+/**
+ * @param {{
+ *   config: import('types').ValidatedConfig;
+ *   vite_config: import('vite').ResolvedConfig;
+ *   vite_config_env: import('vite').ConfigEnv;
+ *   manifest_data: import('types').ManifestData;
+ *   output_dir: string;
+ *   service_worker_entry_file: string | null;
+ * }} options
+ * @param {import('types').Prerendered} prerendered
+ * @param {import('vite').Manifest} client_manifest
+ */
+export async function build_service_worker(
+	{ config, vite_config, manifest_data, output_dir, service_worker_entry_file },
+	prerendered,
+	client_manifest
+) {
+	const build = new Set();
+	for (const key in client_manifest) {
+		const { file, css = [], assets = [] } = client_manifest[key];
+		build.add(file);
+		css.forEach((file) => build.add(file));
+		assets.forEach((file) => build.add(file));
+	}
+
+	const service_worker = `${config.kit.outDir}/generated/service-worker.js`;
+
+	fs.writeFileSync(
+		service_worker,
+		`
+			export const build = [
+				${Array.from(build)
+					.map((file) => `${s(`${config.kit.paths.base}/${file}`)}`)
+					.join(',\n\t\t\t\t')}
+			];
+
+			export const files = [
+				${manifest_data.assets
+					.filter((asset) => config.kit.serviceWorker.files(asset.file))
+					.map((asset) => `${s(`${config.kit.paths.base}/${asset.file}`)}`)
+					.join(',\n\t\t\t\t')}
+			];
+
+			export const prerendered = [
+				${prerendered.paths.map((path) => s(path)).join(',\n\t\t\t\t')}
+			];
+
+			export const version = ${s(config.kit.version.name)};
+		`
+			.replace(/^\t{3}/gm, '')
+			.trim()
+	);
+
+	await vite.build({
+		base: assets_base(config.kit),
+		build: {
+			lib: {
+				entry: /** @type {string} */ (service_worker_entry_file),
+				name: 'app',
+				formats: ['es']
+			},
+			rollupOptions: {
+				output: {
+					entryFileNames: 'service-worker.js'
+				}
+			},
+			outDir: `${output_dir}/client`,
+			emptyOutDir: false
+		},
+		define: vite_config.define,
+		configFile: false,
+		resolve: {
+			alias: [
+				...get_config_aliases(config.kit),
+				{ find: '$service-worker', replacement: service_worker }
+			]
+		}
+	});
+}

package/src/exports/vite/build/utils.js

@@ -0,0 +1,230 @@
+import fs from 'fs';
+import path from 'path';
+import * as vite from 'vite';
+import { get_config_aliases, get_app_aliases } from '../utils.js';
+
+/**
+ * @typedef {import('rollup').RollupOutput} RollupOutput
+ * @typedef {import('rollup').OutputChunk} OutputChunk
+ * @typedef {import('rollup').OutputAsset} OutputAsset
+ */
+
+/**
+ * Invokes Vite.
+ * @param {import('vite').UserConfig} config
+ */
+export async function create_build(config) {
+	const { output } = /** @type {RollupOutput} */ (
+		await vite.build({ ...config, configFile: false })
+	);
+
+	const chunks = output.filter(
+		/** @returns {output is OutputChunk} */ (output) => output.type === 'chunk'
+	);
+
+	const assets = output.filter(
+		/** @returns {output is OutputAsset} */ (output) => output.type === 'asset'
+	);
+
+	return { chunks, assets };
+}
+
+/**
+ * Adds transitive JS and CSS dependencies to the js and css inputs.
+ * @param {import('vite').Manifest} manifest
+ * @param {string} entry
+ * @param {boolean} add_dynamic_css
+ */
+export function find_deps(manifest, entry, add_dynamic_css) {
+	/** @type {Set<string>} */
+	const seen = new Set();
+
+	/** @type {Set<string>} */
+	const imports = new Set();
+
+	/** @type {Set<string>} */
+	const stylesheets = new Set();
+
+	/** @type {Set<string>} */
+	const fonts = new Set();
+
+	/**
+	 * @param {string} current
+	 * @param {boolean} add_js
+	 */
+	function traverse(current, add_js) {
+		if (seen.has(current)) return;
+		seen.add(current);
+
+		const { chunk } = resolve_symlinks(manifest, current);
+
+		if (add_js) imports.add(chunk.file);
+
+		if (chunk.assets) {
+			for (const asset of chunk.assets) {
+				if (/\.(woff2?|ttf|otf)$/.test(asset)) {
+					fonts.add(asset);
+				}
+			}
+		}
+
+		if (chunk.css) {
+			chunk.css.forEach((file) => stylesheets.add(file));
+		}
+
+		if (chunk.imports) {
+			chunk.imports.forEach((file) => traverse(file, add_js));
+		}
+
+		if (add_dynamic_css && chunk.dynamicImports) {
+			chunk.dynamicImports.forEach((file) => traverse(file, false));
+		}
+	}
+
+	const { chunk, file } = resolve_symlinks(manifest, entry);
+
+	traverse(file, true);
+
+	return {
+		file: chunk.file,
+		imports: Array.from(imports),
+		stylesheets: Array.from(stylesheets),
+		fonts: Array.from(fonts)
+	};
+}
+
+/**
+ * @param {import('vite').Manifest} manifest
+ * @param {string} file
+ */
+export function resolve_symlinks(manifest, file) {
+	while (!manifest[file]) {
+		file = path.relative('.', fs.realpathSync(file));
+	}
+
+	const chunk = manifest[file];
+
+	return { chunk, file };
+}
+
+/**
+ * Partial Vite configuration that we use by default for setting up the build.
+ * Can be used in a non-SvelteKit Vite server and build process such as Storybook.
+ * @param {{
+ *   config: import('types').ValidatedConfig;
+ *   ssr: boolean;
+ * }} options
+ * @return {import('vite').UserConfig}
+ */
+export function get_build_setup_config({ config, ssr }) {
+	return {
+		build: {
+			// don't use the default name to avoid collisions with 'static/manifest.json'
+			manifest: 'vite-manifest.json',
+			ssr
+		},
+		define: {
+			__SVELTEKIT_ADAPTER_NAME__: JSON.stringify(config.kit.adapter?.name),
+			__SVELTEKIT_APP_VERSION_FILE__: JSON.stringify(`${config.kit.appDir}/version.json`),
+			__SVELTEKIT_APP_VERSION_POLL_INTERVAL__: JSON.stringify(config.kit.version.pollInterval),
+			__SVELTEKIT_EMBEDDED__: config.kit.embedded ? 'true' : 'false'
+		},
+		resolve: {
+			alias: [...get_app_aliases(config.kit), ...get_config_aliases(config.kit)]
+		},
+		optimizeDeps: {
+			exclude: ['@sveltejs/kit']
+		},
+		ssr: {
+			noExternal: [
+				// TODO document why this is necessary
+				'@sveltejs/kit',
+				// 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 to resolve 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'
+			]
+		}
+	};
+}
+
+/**
+ * Partial Vite configuration that we use by default for setting up the build.
+ * Cannot be used in a non-SvelteKit Vite server and build process such as Storybook.
+ * @param {{
+ *   config: import('types').ValidatedConfig;
+ *   input: Record<string, string>;
+ *   ssr: boolean;
+ *   outDir: string;
+ * }} options
+ * @return {import('vite').UserConfig}
+ */
+export function get_build_compile_config({ config, input, ssr, outDir }) {
+	const prefix = `${config.kit.appDir}/immutable`;
+
+	return {
+		appType: 'custom',
+		base: ssr ? assets_base(config.kit) : './',
+		build: {
+			cssCodeSplit: true,
+			outDir,
+			rollupOptions: {
+				input,
+				output: {
+					format: 'esm',
+					entryFileNames: ssr ? '[name].js' : `${prefix}/[name]-[hash].js`,
+					chunkFileNames: ssr ? 'chunks/[name].js' : `${prefix}/chunks/[name]-[hash].js`,
+					assetFileNames: `${prefix}/assets/[name]-[hash][extname]`,
+					hoistTransitiveImports: false
+				},
+				preserveEntrySignatures: 'strict'
+			},
+			target: ssr ? 'node16.14' : undefined
+		},
+		publicDir: ssr ? false : config.kit.files.assets,
+		worker: {
+			rollupOptions: {
+				output: {
+					entryFileNames: `${prefix}/workers/[name]-[hash].js`,
+					chunkFileNames: `${prefix}/workers/chunks/[name]-[hash].js`,
+					hoistTransitiveImports: false
+				}
+			}
+		}
+	};
+}
+
+/**
+ * The Vite configuration that we use by default for building.
+ * @param {{
+ *   config: import('types').ValidatedConfig;
+ *   input: Record<string, string>;
+ *   ssr: boolean;
+ *   outDir: string;
+ * }} options
+ * @return {import('vite').UserConfig}
+ */
+export function get_default_build_config(options) {
+	return vite.mergeConfig(get_build_setup_config(options), get_build_compile_config(options));
+}
+
+/**
+ * @param {import('types').ValidatedKitConfig} config
+ * @returns {string}
+ */
+export function assets_base(config) {
+	return (config.paths.assets || config.paths.base || '.') + '/';
+}
+
+const method_names = new Set(['GET', 'HEAD', 'PUT', 'POST', 'DELETE', 'PATCH']);
+
+// If we'd written this in TypeScript, it could be easy...
+/**
+ * @param {string} str
+ * @returns {str is import('types').HttpMethod}
+ */
+export function is_http_method(str) {
+	return method_names.has(str);
+}