@vigla/kit 0.0.0-stage → 0.1.1

package/src/vite/env.ts

@@ -0,0 +1,82 @@
+import { uneval } from 'devalue';
+import type { ValidatedConfig } from '../types/builder.ts';
+import type { Environment } from '../sync/index.ts';
+import { ids } from './ids.ts';
+import { posix } from './paths.ts';
+
+export function environmentConfig(environment: Environment, name: string, dev: boolean): string {
+	const lines = [
+		`import { validate, handleIssues } from ${JSON.stringify(`${name}/internal/env`)};`,
+		'const publicEnv = {}, privateEnv = {}, rendered = {}; export const environment = { public: publicEnv, private: privateEnv, rendered }; let variables = {}; export let values = {};'
+	];
+	const setters: string[] = [];
+	Object.entries(environment.variables).forEach(([key, config], index) => {
+		const binding = `value${index}`;
+		lines.push(
+			`export let ${binding} = ${uneval(config.static || dev ? environment.validated[key] : undefined)}; ${config.public ? 'publicEnv' : 'privateEnv'}[${JSON.stringify(key)}] = ${binding};`
+		);
+		if (config.public && !config.static && dev)
+			lines.push(`rendered[${JSON.stringify(key)}] = ${binding};`);
+		if (!config.static)
+			setters.push(
+				`${binding} = validate(variables, values[${JSON.stringify(key)}], ${JSON.stringify(key)}, issues);`
+			);
+		setters.push(
+			`${config.public ? 'publicEnv' : 'privateEnv'}[${JSON.stringify(key)}] = ${binding};`
+		);
+		if (config.public && !config.static)
+			setters.push(`rendered[${JSON.stringify(key)}] = ${binding};`);
+	});
+	const variables = environment.file
+		? `(await import(${JSON.stringify(posix(environment.file))})).variables`
+		: '{}';
+	lines.push(
+		`export function updateEnv(next) { values = next; const issues = {}; ${setters.join('\n')} handleIssues(issues); return environment; }`,
+		`export async function setEnv(next) { variables = ${variables}; return updateEnv(next); }`,
+		'export { setEnv as set_env };'
+	);
+	return lines.join('\n');
+}
+
+export function environmentModule(
+	environment: Environment,
+	visibility: 'public' | 'private',
+	client: boolean,
+	dev: boolean
+): string {
+	const entries = Object.entries(environment.variables).filter(
+		([, config]) => !!config.public === (visibility === 'public')
+	);
+	if (!entries.length) return 'export {};';
+	if (!client)
+		return `export { ${entries.map(([name]) => `value${Object.keys(environment.variables).indexOf(name)} as ${name}`).join(', ')} } from ${JSON.stringify(ids.env)};`;
+	const runtime = !dev && entries.some(([, config]) => !config.static);
+	return `${runtime ? `import { env } from '#env/dynamic/public';\n` : ''}${entries.map(([name, config], index) => `const value${index} = ${!dev && !config.static ? `env[${JSON.stringify(name)}]` : uneval(environment.validated[name])}; export { value${index} as ${name} };`).join('\n')}`;
+}
+
+export function workerEnvironment(
+	environment: Environment,
+	config: ValidatedConfig,
+	name: string,
+	dev: boolean
+): string {
+	const dynamic =
+		!dev &&
+		Object.values(environment.variables).some((variable) => variable.public && !variable.static);
+	const values = Object.fromEntries(
+		Object.entries(environment.variables)
+			.filter(([, variable]) => variable.public)
+			.map(([key]) => [key, environment.validated[key]])
+	);
+	return `import { init } from ${JSON.stringify(`${name}/internal/payload`)}; ${dynamic ? `import { env } from ${JSON.stringify(config.paths.base + '/' + config.appDir + '/env.js')};` : ''} init({ base: location.pathname.split('/').slice(0, -1).join('/'), app_dir: ${JSON.stringify(config.appDir)}, hash: ${config.router.type === 'hash'}, version: ${JSON.stringify(config.version.name)}, env: ${
+		dynamic
+			? `Object.assign(${uneval(
+					Object.fromEntries(
+						Object.entries(environment.variables)
+							.filter(([, variable]) => variable.public && variable.static)
+							.map(([key]) => [key, environment.validated[key]])
+					)
+				)}, env)`
+			: uneval(values)
+	} });`;
+}

package/src/vite/ids.ts

@@ -0,0 +1,39 @@
+import path from 'node:path';
+import { codeDirectory, posix } from './paths.ts';
+import { hash } from '../shared/hash.ts';
+import type { ResolvedConfig } from 'vite';
+import type { ValidatedConfig } from '../types/builder.ts';
+import type { Project } from './project.ts';
+
+export function namespace(version: string, dev: boolean): string {
+	return dev ? '__vigla_dev' : `__vigla_${hash(version)}`;
+}
+export const virtualDirectory = `${posix(codeDirectory)}vite/__generated__/`;
+export const ids = {
+	server: `${virtualDirectory}server.js`,
+	manifest: `${virtualDirectory}manifest.js`,
+	appManifest: `${virtualDirectory}app-manifest.js`,
+	options: `${virtualDirectory}options.js`,
+	client: `${virtualDirectory}client/app.js`,
+	bundle: `${virtualDirectory}client/bundle.js`,
+	bootstrap: `${virtualDirectory}client/bootstrap.js`,
+	errorTemplate: `${virtualDirectory}error-template.js`,
+	root: `${virtualDirectory}components/root.js`,
+	layout: `${virtualDirectory}components/layout.js`,
+	error: `${virtualDirectory}components/error.js`,
+	env: `${virtualDirectory}env/config.js`,
+	workerEnv: `${virtualDirectory}env/service-worker.js`,
+	workerIdentity: `${virtualDirectory}env/service-worker-identity.js`,
+	publicEnv: `${virtualDirectory}env/public.js`,
+	privateEnv: `${virtualDirectory}env/private.js`
+};
+
+export function clientDirectory(config: ValidatedConfig, vite: ResolvedConfig): string {
+	return posix(
+		path.join(config.outDir, 'generated', vite.command === 'serve' ? 'dev' : 'build', 'client')
+	);
+}
+
+export function nodeId(project: Project, index: number): string {
+	return `${clientDirectory(project.config, project.vite)}/nodes/${index}.js`;
+}

package/src/vite/index.ts

@@ -0,0 +1,284 @@
+import path from 'node:path';
+import { vigla, type Options, type PluginAPI, type PluginFactory } from '@vigla/vite-plugin';
+import type { CorsOptions, Plugin, ResolvedConfig, UserConfig } from 'vite';
+import { resolveConfig, splitConfig, validateConfig } from '../config/index.ts';
+import {
+	createSync,
+	installation,
+	loadEnvironment,
+	validateEnvironment,
+	resolveEntry
+} from '../sync/index.ts';
+import { configAliases, importVite } from '../config/file.ts';
+import type { Config, Framework } from '../types/config.ts';
+import type { Identity } from '../types/identity.ts';
+import type { ValidatedConfig } from '../types/builder.ts';
+import { own } from '../shared/identity.ts';
+import { diagnostics } from '../shared/diagnostics.ts';
+import { configureDev } from './dev.ts';
+import { namespace } from './ids.ts';
+import { ViteMessages } from './messages.ts';
+import { scanVirtualModules, serverGuard, virtualModules } from './modules.ts';
+import { importAliases, posix, packageDirectory, usesHtmlHook } from './paths.ts';
+import type { Project } from './project.ts';
+import { createRemotePlugin } from './remote.ts';
+import { buildPlugin } from './build.ts';
+import { configurePreview } from './preview.ts';
+
+export type { Config, Framework } from '../types/config.ts';
+export type { Identity, Links } from '../types/identity.ts';
+
+function resolveCors(
+	cors: CorsOptions | boolean | undefined,
+	key: 'server.cors' | 'preview.cors',
+	warn: ViteMessages | null
+): CorsOptions | undefined {
+	if (cors === undefined) return key === 'server.cors' ? { preflightContinue: true } : undefined;
+	if (cors === false) return undefined;
+	if (typeof cors === 'object') {
+		if (cors.preflightContinue === undefined) return { preflightContinue: true };
+		if (cors.preflightContinue) return undefined;
+	}
+	warn?.cors_preflight_continue({ key });
+	return undefined;
+}
+
+function definitions(
+	config: ValidatedConfig,
+	identity: Identity,
+	dev: boolean,
+	worker: boolean,
+	globalName: string
+): Record<string, string> {
+	const values: Record<string, unknown> = {
+		__VIGLA_IDENTITY__: identity,
+		__VIGLA_APP_DIR__: config.appDir,
+		__VIGLA_APP_VERSION__: config.version.name,
+		__VIGLA_APP_VERSION_CHECKS_ENABLED__: config.output.bundleStrategy !== 'inline',
+		__VIGLA_APP_VERSION_POLL_INTERVAL__: dev ? 0 : config.version.pollInterval,
+		__VIGLA_EMBEDDED__: config.embedded,
+		__VIGLA_FORK_PRELOADS__: config.experimental.forkPreloads,
+		__VIGLA_PATHS_ASSETS__: config.paths.assets,
+		__VIGLA_PATHS_BASE__: config.paths.base,
+		__VIGLA_PATHS_ORIGIN__: config.paths.origin,
+		__VIGLA_PATHS_RELATIVE__: config.paths.relative,
+		__VIGLA_CLIENT_ROUTING__: config.router.resolution === 'client',
+		__VIGLA_HASH_ROUTING__: config.router.type === 'hash',
+		__VIGLA_SERVER_TRACING_ENABLED__: config.tracing.server,
+		__VIGLA_SUPPORTS_ASYNC__: true,
+		__VIGLA_DEV__: dev,
+		__VIGLA_GLOBAL_NAME__: globalName,
+		__VIGLA_CSRF_CHECK_ORIGIN__: !config.csrf.trustedOrigins.includes('*'),
+		__VIGLA_LINK_HEADER_PRELOAD__: config.output.linkHeaderPreload,
+		__VIGLA_SERVICE_WORKER__: config.serviceWorker.register && worker,
+		__VIGLA_HAS_SERVER_LOAD__: true,
+		__VIGLA_HAS_UNIVERSAL_LOAD__: true
+	};
+	return {
+		...Object.fromEntries(
+			Object.entries(values).map(([key, value]) => [key, JSON.stringify(value) ?? 'undefined'])
+		),
+		__VIGLA_PAYLOAD__: `globalThis.${globalName}`
+	};
+}
+
+export function createKit<O extends object>(
+	identity: Identity,
+	factory: PluginFactory<O>
+): Framework<O> {
+	return (input = {} as Config<O>) =>
+		plugins(input as Config, factory as PluginFactory<object>, identity);
+}
+
+export const kit: Framework<Options> = createKit(own, vigla);
+
+async function plugins(
+	input: Config,
+	factory: PluginFactory<object>,
+	identity: Identity
+): Promise<Plugin[]> {
+	const d = diagnostics(identity);
+	const e: ViteMessages = new ViteMessages(d);
+	const split = splitConfig(input, d);
+	const validated = validateConfig(split.config, d);
+	const options: Partial<Options> = { ...split.plugin, configFile: false };
+	if (input.compilerOptions !== undefined) options.compilerOptions = input.compilerOptions;
+	if (input.preprocess !== undefined) options.preprocess = input.preprocess;
+	if (input.extensions !== undefined) options.extensions = input.extensions;
+	const compiler = factory(options);
+	const api = compiler.find((plugin) => plugin.name === factory.marker)!.api as PluginAPI;
+	let root: string;
+	let name: string;
+	let dependency: string;
+	let config: ValidatedConfig;
+	let project: Project;
+	let runtime: typeof import('vite');
+	let globalName: string;
+	let resolved: ResolvedConfig;
+	let initialisation: Promise<Project> | undefined;
+	const remote = createRemotePlugin(() => project, identity);
+	function initialise(): Promise<Project> {
+		return (initialisation ??= (async () => {
+			const sync = createSync(config, root, d);
+			const tree = await sync.initial(resolved.mode);
+			const environment = await loadEnvironment(config, root, resolved.mode, runtime, d);
+			if (resolved.command === 'build') validateEnvironment(environment, d);
+			sync.writeEnvironment(environment.file, environment.variables);
+			const firstFormat = api.frontEnds[0]?.compiler.format;
+			const sameFormat = api.frontEnds.every(
+				({ compiler }) =>
+					compiler.format?.global === firstFormat?.global &&
+					compiler.format?.meta === firstFormat?.meta &&
+					compiler.format?.cssWrapper === firstFormat?.cssWrapper
+			);
+			project = {
+				identity,
+				diagnostics: d,
+				root,
+				name,
+				global: globalName,
+				remote,
+				config,
+				vite: resolved,
+				api: runtime,
+				sync,
+				tree,
+				environment,
+				format: sameFormat ? firstFormat : undefined,
+				serviceWorker: resolveEntry(config.files.serviceWorker, config.moduleExtensions)
+			};
+			return project;
+		})());
+	}
+	const setup: Plugin = {
+		name: 'kit:setup',
+		enforce: 'pre',
+		api: {
+			options: validated,
+			identity,
+			hooks: (): Record<'server' | 'client', string | null> => {
+				const hooks = project?.tree.hooks;
+				const absolute = (file: string | null | undefined) =>
+					file ? posix(path.resolve(root, file)) : null;
+				return { server: absolute(hooks?.server), client: absolute(hooks?.client) };
+			}
+		},
+		config: {
+			order: 'pre',
+			async handler(user, env) {
+				root = posix(path.resolve(user.root ?? process.cwd()));
+				runtime = await importVite(root);
+				({ name, path: dependency } = installation(root));
+				config = resolveConfig(validated, root, d);
+				setup.api.options = config;
+				const dev = env.command === 'serve';
+				globalName = namespace(config.version.name, dev);
+				const aliases = importAliases(root);
+				const workspace = runtime.searchForWorkspaceRoot(root);
+				const allow = new Set([
+					config.files.routes,
+					config.files.src,
+					config.outDir,
+					packageDirectory,
+					path.join(root, 'node_modules'),
+					path.join(workspace, 'node_modules'),
+					...aliases.map((alias) => alias.path)
+				]);
+				if (user.server?.fs?.allow === undefined) allow.add(workspace);
+				const hooks = resolveEntry(config.files.hooks.client, config.moduleExtensions);
+				if (hooks) allow.add(path.dirname(hooks));
+				const worker = resolveEntry(config.files.serviceWorker, config.moduleExtensions);
+				const result: UserConfig = {
+					appType: 'custom',
+					base: config.paths.base || '/',
+					publicDir: config.files.assets,
+					define: definitions(config, identity, dev, !!worker, globalName),
+					resolve: { alias: configAliases(config, root) },
+					environments: {
+						client: {
+							consumer: 'client',
+							resolve: { conditions: ['browser', 'module', 'development|production'] }
+						},
+						ssr: {
+							consumer: 'server',
+							resolve: { conditions: ['node', 'module', 'development|production'] },
+							build: {
+								sourcemap: user.environments?.ssr?.build?.sourcemap ?? user.build?.sourcemap ?? true
+							}
+						}
+					},
+					server: {
+						cors: resolveCors(user.server?.cors, 'server.cors', dev ? e : null),
+						fs: { allow: [...allow] },
+						watch: {
+							ignored: [
+								`${posix(config.outDir)}/!(generated)`,
+								`${posix(config.outDir)}/!(generated)/**`
+							]
+						},
+						sourcemapIgnoreList: (file) =>
+							file.includes('node_modules') || file.includes(config.outDir)
+					},
+					preview: { cors: resolveCors(user.preview?.cors, 'preview.cors', dev ? e : null) },
+					optimizeDeps: {
+						rolldownOptions: { plugins: [scanVirtualModules(), remote.scan] },
+						entries: [
+							`${config.files.routes}/**/+*.{js,ts}`,
+							`!${config.files.routes}/**/+*server.*`
+						],
+						exclude: [name, '@vigla/kit', '$app', '$env'],
+						include: [`${dependency} > devalue`, `${dependency} > esm-env`]
+					},
+					ssr: {
+						noExternal: [name, '@vigla/kit', 'vigla', 'esm-env', 'devalue', 'cookie'],
+						external: ['@opentelemetry/api']
+					}
+				};
+				const overridden = (['appType', 'base', 'publicDir'] as const).filter(
+					(key) => user[key] !== undefined && user[key] !== result[key]
+				);
+				if (overridden.length)
+					e.vite_config_overridden({ options: overridden.map((key) => `  - ${key}`).join('\n') });
+				return result;
+			}
+		},
+		configResolved(vite) {
+			resolved = vite;
+			if (!input.extensions)
+				config.extensions = [...new Set(api.frontEnds.flatMap((frontEnd) => frontEnd.components))];
+			for (const env of Object.values(vite.environments)) {
+				if (env.consumer !== 'client') continue;
+				const entries = env.optimizeDeps.entries;
+				if (Array.isArray(entries))
+					entries.push(
+						...config.extensions.map((extension) => `${config.files.routes}/**/+*${extension}`)
+					);
+			}
+			const html = vite.plugins.filter(usesHtmlHook);
+			if (html.length)
+				e.transform_index_html_unsupported({
+					plugins: html.map((plugin) => `  - ${plugin.name}`).join('\n')
+				});
+		},
+		async buildStart() {
+			await initialise();
+		},
+		async configureServer(server) {
+			return configureDev(server, await initialise());
+		},
+		async configurePreviewServer(server) {
+			return configurePreview(server, await initialise());
+		}
+	};
+	return [
+		...compiler,
+		setup,
+		serverGuard(() => config, e),
+		virtualModules(
+			() => config,
+			() => project
+		),
+		...remote.plugins,
+		buildPlugin(validated, initialise, d)
+	];
+}

package/src/vite/messages.ts

@@ -0,0 +1,149 @@
+import type { Diagnostics } from '../shared/diagnostics.ts';
+
+interface FileMessage {
+	file: string;
+}
+interface AdapterMessage {
+	file: string;
+	adapter: string;
+}
+interface MatcherMessage {
+	name: string;
+	file?: string;
+}
+interface ImportMessage {
+	module: string;
+	chain: string;
+}
+interface ConfigMessage {
+	options: string;
+}
+interface CorsMessage {
+	key: string;
+}
+interface PluginsMessage {
+	plugins: string;
+}
+
+export class ViteMessages {
+	private readonly d: Diagnostics;
+	constructor(d: Diagnostics) {
+		this.d = d;
+	}
+	adapter_instrumentation_unsupported({ file, adapter }: AdapterMessage): never {
+		this.d.raise(
+			'adapter_instrumentation_unsupported',
+			`\`${file}\` is unsupported in \`${adapter}\`.`,
+			this.adapter_instrumentation_unsupported
+		);
+	}
+	server_only_import({ module, chain }: ImportMessage): never {
+		this.d.raise(
+			'server_only_import',
+			`Cannot import \`${module}\` into code that runs in the browser, as this could leak sensitive information.\n\n${chain}\n\nIf you're only using the import as a type, change it to \`import type\`.`,
+			this.server_only_import
+		);
+	}
+	service_worker_invalid_import({ modules }: { modules: string }): never {
+		this.d.raise(
+			'service_worker_invalid_import',
+			`Cannot import ${modules} into service-worker code.`,
+			this.service_worker_invalid_import
+		);
+	}
+	config_feature_disabled({
+		feature,
+		keypath,
+		value
+	}: {
+		feature: string;
+		keypath: string;
+		value: string;
+	}): never {
+		const parts = keypath.split('.');
+		const snippet = parts
+			.map(
+				(part, index) => `${'  '.repeat(index)}${part}: ${index === parts.length - 1 ? value : '{'}`
+			)
+			.concat(parts.slice(1).map((_, index) => `${'  '.repeat(parts.length - 2 - index)}}`))
+			.join('\n');
+		this.d.raise(
+			'config_feature_disabled',
+			`To enable ${feature}, add the following to your ${this.d.identity.product} plugin in \`vite.config.js\`:\n\n${snippet}`,
+			this.config_feature_disabled
+		);
+	}
+	config_csp_trusted_html_missing({ policy }: { policy: string }): never {
+		this.d.raise(
+			'config_csp_trusted_html_missing',
+			`The \`csp.directives['trusted-types']\` option must include \`'${policy}'\` unless all pages have \`csr: false\``,
+			this.config_csp_trusted_html_missing
+		);
+	}
+	fetch_relative_url({ url }: { url: string }): never {
+		this.d.raise(
+			'fetch_relative_url',
+			`Cannot use relative URL (\`${url}\`) with global \`fetch\` — use \`event.fetch\` instead${this.d.docs('fetch', (link) => `: ${link}`)}`,
+			this.fetch_relative_url
+		);
+	}
+	remote_module_invalid_export({ name, file }: { name: string; file: string }): never {
+		this.d.raise(
+			'remote_module_invalid_export',
+			`\`${name}\` exported from \`${file}\` is invalid — all exports from this file must be remote functions`,
+			this.remote_module_invalid_export
+		);
+	}
+	adapter_missing(): void {
+		this.d.warn(
+			'adapter_missing',
+			`No adapter specified.${this.d.docs('adapters', (url) => ` See ${url} to learn how to configure your app to run on the platform of your choosing`)}`
+		);
+	}
+	service_worker_assets(): never {
+		this.d.raise(
+			'service_worker_assets',
+			'Cannot use service worker alongside `config.paths.assets`',
+			this.service_worker_assets
+		);
+	}
+	preview_build_missing({ dir }: { dir: string }): never {
+		this.d.raise(
+			'preview_build_missing',
+			`Server files not found at \`${dir}\`, did you run \`build\` first?`,
+			this.preview_build_missing
+		);
+	}
+	params_export_missing({ file }: FileMessage): never {
+		this.d.raise(
+			'params_export_missing',
+			`\`${file}\` does not export \`params\` from \`defineParams\``,
+			this.params_export_missing
+		);
+	}
+	param_matcher_missing({ name, file }: MatcherMessage): never {
+		this.d.raise(
+			'param_matcher_missing',
+			`No matcher found for parameter \`${name}\`${file ? ` in \`${file}\`` : ''}`,
+			this.param_matcher_missing
+		);
+	}
+	cors_preflight_continue({ key }: CorsMessage): void {
+		this.d.warn(
+			'cors_preflight_continue',
+			`\`OPTIONS\` request handlers will not work unless \`${key}.preflightContinue\` is set to \`true\``
+		);
+	}
+	transform_index_html_unsupported({ plugins }: PluginsMessage): void {
+		this.d.warn(
+			'transform_index_html_unsupported',
+			`The following plugins may not work correctly because they use the \`transformIndexHtml\` hook which is not supported:\n${plugins}`
+		);
+	}
+	vite_config_overridden({ options }: ConfigMessage): void {
+		this.d.warn(
+			'vite_config_overridden',
+			`The following Vite config options will be overridden by ${this.d.identity.product}:\n${options}`
+		);
+	}
+}