@vigla/vite-plugin 0.0.0-stage → 0.1.1

package/src/id.ts

@@ -0,0 +1,225 @@
+import fs from 'node:fs';
+import process from 'node:process';
+import { normalizePath } from 'vite';
+import type { CompileOptions } from './compiler.ts';
+import type { FrontEnd } from './front-end.ts';
+import { styleQuery, type Identity } from './identity.ts';
+import { arraify, type ResolvedOptions } from './options.ts';
+
+const fsPrefix = '/@fs/';
+const windows = process.platform === 'win32';
+const queryCompilerOptions = ['generate', 'dev', 'css', 'customElement', 'immutable'];
+const typesWithCompilerOptions = ['style', 'script', 'all'];
+
+export interface RequestQuery {
+	url?: boolean;
+	raw?: boolean;
+	direct?: boolean;
+	type?: string;
+	sourcemap?: boolean;
+	compilerOptions?: Partial<CompileOptions>;
+	[name: string]: unknown;
+}
+
+export interface ModuleRequest {
+	id: string;
+	filename: string;
+	normalizedFilename: string;
+	query: RequestQuery;
+	timestamp: number;
+	ssr: boolean;
+	frontEnd: FrontEnd;
+}
+
+export interface ComponentRequest extends ModuleRequest {
+	cssId: string;
+	raw: boolean;
+}
+
+export interface IdFilter {
+	id: { include: (string | RegExp)[]; exclude: (string | RegExp)[] };
+}
+
+export type IdParser = (
+	id: string,
+	ssr: boolean,
+	timestamp?: number
+) => ComponentRequest | undefined;
+export type ModuleIdParser = (
+	id: string,
+	ssr: boolean,
+	timestamp?: number
+) => ModuleRequest | undefined;
+
+function split(id: string): { filename: string; rawQuery: string } {
+	const [filename = '', rawQuery = ''] = id.split('?', 2);
+	return { filename, rawQuery };
+}
+
+function parseQuery(rawQuery: string, { names, log }: Identity): RequestQuery {
+	const query: Record<string, unknown> = Object.fromEntries(new URLSearchParams(rawQuery));
+	for (const key in query) if (query[key] === '') query[key] = true;
+	const given = query.compilerOptions;
+	if (typeof given === 'string') {
+		if (!((query.raw || query.direct) && typesWithCompilerOptions.includes(String(query.type)))) {
+			throw new Error(
+				`Invalid compilerOptions in query ${rawQuery}. CompilerOptions are only supported for raw or direct queries with type in "${typesWithCompilerOptions.join(', ')}" e.g. '?${names.styleFlag}&raw&type=script&compilerOptions={"generate":"server","dev":false}`
+			);
+		}
+		try {
+			const parsed = JSON.parse(given) as Record<string, unknown>;
+			const invalid = Object.keys(parsed).filter((key) => !queryCompilerOptions.includes(key));
+			if (invalid.length > 0) {
+				throw new Error(
+					`Invalid compilerOptions in query ${rawQuery}: ${invalid.join(', ')}. Supported: ${queryCompilerOptions.join(', ')}`
+				);
+			}
+			query.compilerOptions = parsed;
+		} catch (error) {
+			log.error('failed to parse request query compilerOptions', error);
+			throw error;
+		}
+	}
+	return query as RequestQuery;
+}
+
+export function normalize(filename: string, root: string): string {
+	const normalized = normalizePath(filename);
+	return normalized.startsWith(`${root}/`) ? normalized.slice(root.length) : normalized;
+}
+
+function existsInRoot(filename: string, root: string): boolean {
+	return !filename.startsWith(fsPrefix) && fs.existsSync(root + filename);
+}
+
+function styleId(filename: string, root: string, identity: Identity): string {
+	let path = filename;
+	if (existsInRoot(filename, root)) path = root + filename;
+	else if (filename.startsWith(fsPrefix)) {
+		path = windows ? filename.slice(fsPrefix.length) : filename.slice(fsPrefix.length - 1);
+	}
+	return `${path}${styleQuery(identity.names)}`;
+}
+
+function escape(text: string): string {
+	return text.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+}
+
+function bare(extension: string): string {
+	return escape(extension.startsWith('.') ? extension.slice(1) : extension);
+}
+
+function componentPattern(extensions: readonly string[]): RegExp {
+	return new RegExp(`^[^?#]+\\.(?:${extensions.map(bare).join('|')})(?:[?#]|$)`);
+}
+
+function modulePattern(infixes: readonly string[], extensions: readonly string[]): RegExp {
+	return new RegExp(
+		`^[^?#]+(?:${infixes.map(escape).join('|')})(?:[^.\\\\/]+\\.)*(?:${extensions.map(bare).join('|')})(?:[?#]|$)`
+	);
+}
+
+function claims(patterns: readonly RegExp[], frontEnds: readonly FrontEnd[]) {
+	return (filename: string): FrontEnd =>
+		frontEnds[patterns.findIndex((pattern) => pattern.test(filename))] ??
+		(frontEnds[0] as FrontEnd);
+}
+
+function componentPatterns(options: ResolvedOptions, frontEnds: readonly FrontEnd[]): RegExp[] {
+	return frontEnds.map((frontEnd) =>
+		componentPattern(frontEnds.length === 1 ? options.extensions : frontEnd.components)
+	);
+}
+
+export function buildIdFilter(
+	options: ResolvedOptions,
+	frontEnds: readonly FrontEnd[],
+	{ virtualStyle }: Identity
+): IdFilter {
+	return {
+		id: {
+			include:
+				frontEnds.length === 0
+					? [/$./]
+					: [...componentPatterns(options, frontEnds), ...arraify(options.include)],
+			exclude: ['\0', virtualStyle, ...arraify(options.exclude)]
+		}
+	};
+}
+
+export function buildIdParser(
+	options: ResolvedOptions,
+	frontEnds: readonly FrontEnd[],
+	identity: Identity
+): IdParser {
+	if (frontEnds.length === 0) return () => undefined;
+	const root = normalizePath(options.root);
+	const claim = claims(componentPatterns(options, frontEnds), frontEnds);
+	return (id, ssr, timestamp = Date.now()) => {
+		const { filename, rawQuery } = split(id);
+		const query = parseQuery(rawQuery, identity);
+		const rawOrDirect = !!(query.raw || query.direct);
+		if (query.url || (!query[identity.names.styleFlag] && rawOrDirect)) return undefined;
+		return {
+			id,
+			filename,
+			normalizedFilename: normalize(filename, root),
+			cssId: styleId(filename, root, identity),
+			query,
+			timestamp,
+			ssr,
+			raw: rawOrDirect,
+			frontEnd: claim(filename)
+		};
+	};
+}
+
+function modulePatterns(options: ResolvedOptions, frontEnds: readonly FrontEnd[]): RegExp[] {
+	const given = frontEnds.length === 1 ? (options.experimental?.compileModule ?? {}) : {};
+	return frontEnds.map((frontEnd) =>
+		modulePattern(
+			given.infixes ?? frontEnd.modules.infixes,
+			given.extensions ?? frontEnd.modules.extensions
+		)
+	);
+}
+
+export function buildModuleIdFilter(
+	options: ResolvedOptions,
+	frontEnds: readonly FrontEnd[]
+): IdFilter {
+	const given = options.experimental?.compileModule ?? {};
+	return {
+		id: {
+			include:
+				frontEnds.length === 0
+					? [/$./]
+					: [...modulePatterns(options, frontEnds), ...arraify(given.include)],
+			exclude: ['\0', ...arraify(given.exclude)]
+		}
+	};
+}
+
+export function buildModuleIdParser(
+	options: ResolvedOptions,
+	frontEnds: readonly FrontEnd[],
+	identity: Identity
+): ModuleIdParser {
+	if (frontEnds.length === 0) return () => undefined;
+	const root = normalizePath(options.root);
+	const claim = claims(modulePatterns(options, frontEnds), frontEnds);
+	return (id, ssr, timestamp = Date.now()) => {
+		const { filename, rawQuery } = split(id);
+		const query = parseQuery(rawQuery, identity);
+		if (query.url || query.raw || query.direct) return undefined;
+		return {
+			id,
+			filename,
+			normalizedFilename: normalize(filename, root),
+			query,
+			timestamp,
+			ssr,
+			frontEnd: claim(filename)
+		};
+	};
+}

package/src/identity.ts

@@ -0,0 +1,74 @@
+import type { ResolvedConfig } from 'vite';
+import { createLog, type Log } from './log.ts';
+import { ownMessages, type Messages } from './messages.ts';
+
+export interface Links {
+	readonly cssHash?: string;
+	readonly preprocess?: string;
+	readonly missingCondition?: string;
+}
+
+export interface Names {
+	readonly prebundle: string;
+	readonly resolveWarnings: string;
+	readonly warningsEvent: string;
+	readonly styleFlag: string;
+	readonly metaKey: string;
+	readonly metadataFile: string;
+	readonly withoutSources: readonly string[];
+	readonly withoutSourcesPrefixes: readonly string[];
+	readonly links: Links;
+}
+
+export interface History {
+	options?(options: Record<string, unknown>, log: Log): void;
+	config?(config: ResolvedConfig, log: Log): void;
+}
+
+export interface Naming {
+	readonly name: string;
+	readonly names?: Partial<Names>;
+	readonly messages?: Partial<Messages>;
+	readonly history?: History;
+}
+
+export interface Identity {
+	readonly name: string;
+	readonly log: Log;
+	readonly names: Names;
+	readonly messages: Messages;
+	readonly history: History;
+	readonly virtualStyle: RegExp;
+}
+
+export const ownNames: Names = {
+	prebundle: 'prebundleLibraries',
+	resolveWarnings: 'disableResolveWarnings',
+	warningsEvent: 'vigla:warnings',
+	styleFlag: 'vigla',
+	metaKey: 'vigla',
+	metadataFile: '_prebundle_metadata.json',
+	withoutSources: [],
+	withoutSourcesPrefixes: [],
+	links: {}
+};
+
+function escape(text: string): string {
+	return text.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+}
+
+export function styleQuery(names: Names): string {
+	return `?${names.styleFlag}&type=style&lang.css`;
+}
+
+export function createIdentity({ name, names, messages, history }: Naming): Identity {
+	const resolved: Names = { ...ownNames, ...names };
+	return {
+		name,
+		log: createLog(name),
+		names: resolved,
+		messages: { ...ownMessages, ...messages },
+		history: history ?? {},
+		virtualStyle: new RegExp(`[?&]${escape(resolved.styleFlag)}&type=style&lang.css$`)
+	};
+}

package/src/index.ts

@@ -0,0 +1,61 @@
+import process from 'node:process';
+import type { Plugin, UserConfig } from 'vite';
+import type { PluginAPI } from './api.ts';
+import { loadConfig, type LoadedConfig } from './config-file.ts';
+import { createIdentity, type Naming } from './identity.ts';
+import { compile } from './plugins/compile.ts';
+import { compileModule } from './plugins/compile-module.ts';
+import { configure } from './plugins/configure.ts';
+import { hotUpdate } from './plugins/hot-update.ts';
+import { loadCompiledCss, loadCustom } from './plugins/load.ts';
+import { setupOptimizer } from './plugins/optimizer.ts';
+import { preprocess } from './plugins/preprocess.ts';
+import type { RawOptions } from './options.ts';
+import type { Options } from './public.ts';
+
+export { vitePreprocess } from './preprocess.ts';
+export type * from './public.ts';
+export type { PluginAPI } from './api.ts';
+export type { Compiler } from './compiler.ts';
+export type { LoadedConfig } from './config-file.ts';
+export type { FrontEnd } from './front-end.ts';
+export type { History, Links, Names, Naming } from './identity.ts';
+export type { Messages } from './messages.ts';
+export type { Log } from './log.ts';
+
+export interface PluginFactory<O extends object = Options> {
+	(inline?: Partial<O>): Plugin[];
+	readonly marker: string;
+	loadConfig(
+		viteConfig?: UserConfig,
+		inline?: Partial<O>,
+		stem?: string
+	): Promise<LoadedConfig | undefined>;
+}
+
+export function createPlugin<O extends object = Options>(naming: Naming): PluginFactory<O> {
+	const identity = createIdentity(naming);
+	const { name } = identity;
+	const factory = (inline?: Partial<O>): Plugin[] => {
+		if (process.env.DEBUG != null) identity.log.setLevel('debug');
+		const api = {} as PluginAPI;
+		return [
+			{ name, api },
+			configure(api, identity, inline as RawOptions | undefined),
+			setupOptimizer(api, identity),
+			loadCompiledCss(api, identity),
+			loadCustom(api, identity),
+			preprocess(api, identity),
+			compile(api, identity),
+			compileModule(api, identity),
+			hotUpdate(api, identity)
+		];
+	};
+	return Object.assign(factory, {
+		marker: name,
+		loadConfig: (viteConfig?: UserConfig, inline?: Partial<O>, stem?: string) =>
+			loadConfig(identity, viteConfig, inline as RawOptions | undefined, stem)
+	});
+}
+
+export const vigla: PluginFactory<Options> = createPlugin<Options>({ name: 'vigla' });

package/src/log.ts

@@ -0,0 +1,105 @@
+import { styleText } from 'node:util';
+import { createDebug, enabled } from 'obug';
+import type { Warning } from './compiler.ts';
+
+type Level = 'debug' | 'info' | 'warn' | 'error' | 'silent';
+
+const levels: Level[] = ['debug', 'info', 'warn', 'error', 'silent'];
+const on: Record<Level, boolean> = {
+	debug: false,
+	info: true,
+	warn: true,
+	error: true,
+	silent: false
+};
+const colors: Record<'info' | 'warn' | 'error', Parameters<typeof styleText>[0]> = {
+	info: 'cyan',
+	warn: 'yellow',
+	error: 'red'
+};
+const sinks = {
+	info: (text: unknown) => console.log(text),
+	warn: (text: unknown) => console.warn(text),
+	error: (text: unknown) => console.error(text)
+};
+let current: Level = 'info';
+
+export interface LogFn {
+	(message: string, payload?: unknown, namespace?: string): void;
+	readonly enabled: boolean;
+	once(message: string, payload?: unknown, namespace?: string): void;
+}
+
+export interface Log {
+	readonly debug: LogFn;
+	readonly info: LogFn;
+	readonly warn: LogFn;
+	readonly error: LogFn;
+	debugs(namespace: string): boolean;
+	setLevel(level: string): void;
+}
+
+export function createLog(prefix: string): Log {
+	const debugLog = createDebug(prefix);
+	const debugs = (namespace: string): boolean => enabled(`${prefix}:${namespace}`);
+
+	function write(level: Level, message: string, payload?: unknown, namespace?: string): void {
+		if (!on[level]) return;
+		if (level === 'debug') {
+			if (namespace !== undefined && !debugs(namespace)) return;
+			const debug = namespace === undefined ? debugLog : debugLog.extend(namespace);
+			if (payload !== undefined) debug(message, payload);
+			else debug(message);
+			return;
+		}
+		if (level === 'silent') return;
+		const scope = namespace === undefined ? prefix : `${prefix}:${namespace}`;
+		const line = `${new Date().toLocaleTimeString()} [${scope}] ${message}`;
+		sinks[level](styleText(colors[level], line));
+		if (payload) sinks[level](payload);
+	}
+
+	function logger(level: Level): LogFn {
+		const logged = new Set<string>();
+		const fn = ((message: string, payload?: unknown, namespace?: string) =>
+			write(level, message, payload, namespace)) as LogFn;
+		Object.defineProperty(fn, 'enabled', { get: () => on[level] });
+		Object.defineProperty(fn, 'once', {
+			value: (message: string, payload?: unknown, namespace?: string) => {
+				if (!on[level] || logged.has(message)) return;
+				logged.add(message);
+				write(level, message, payload, namespace);
+			}
+		});
+		return fn;
+	}
+
+	return {
+		debug: logger('debug'),
+		info: logger('info'),
+		warn: logger('warn'),
+		error: logger('error'),
+		debugs,
+		setLevel(level) {
+			if (level === current) return;
+			const index = levels.indexOf(level as Level);
+			if (index < 0) {
+				write('error', `invalid log level: ${level} `);
+				return;
+			}
+			current = level as Level;
+			levels.forEach((name, at) => (on[name] = at >= index));
+		}
+	};
+}
+
+export function buildExtendedLogMessage(warning: Warning): string {
+	const parts: (string | number)[] = [];
+	if (warning.filename) parts.push(warning.filename);
+	if (warning.start) parts.push(':', warning.start.line, ':', warning.start.column);
+	if (warning.message) {
+		if (parts.length > 0) parts.push(' ');
+		parts.push(warning.message);
+	}
+	return parts.join('');
+}

package/src/maps.ts

@@ -0,0 +1,36 @@
+import path from 'node:path';
+import process from 'node:process';
+
+const windows = process.platform === 'win32';
+
+export interface FileRefs {
+	file?: string;
+	sources?: (string | null)[];
+	sourceRoot?: string;
+}
+
+export function mapToRelative(map: FileRefs | null | undefined, filename: string): void {
+	if (!map) return;
+	const root = map.sourceRoot;
+	const dirname = path.dirname(filename);
+	const relative = (source: string | null): string | null => {
+		if (!source) return source;
+		let full: string;
+		if (source.startsWith('file:///')) full = source.slice(windows ? 8 : 7);
+		else if (root)
+			full = `${root}${root.endsWith('/') || source.startsWith('/') ? '' : '/'}${source}`;
+		else full = source;
+		return path.isAbsolute(full) ? path.relative(dirname, full) : full;
+	};
+	if (map.file) map.file = path.basename(filename);
+	if (map.sources) map.sources = map.sources.map(relative);
+	if (map.sourceRoot) delete map.sourceRoot;
+}
+
+export function removeLangSuffix(map: FileRefs | null | undefined, suffix: string): void {
+	if (!map) return;
+	const strip = (source: string | null) =>
+		source?.endsWith(suffix) ? source.slice(0, -suffix.length) : source;
+	if (map.file) map.file = strip(map.file) ?? undefined;
+	if (map.sources) map.sources = map.sources.map(strip);
+}

package/src/messages.ts

@@ -0,0 +1,40 @@
+export interface Messages {
+	readonly configChangeDetected: string;
+	readonly configChanged: (file: string) => string;
+	readonly noClientEnvironment: string;
+	readonly configNotFound: (file: string) => string;
+	readonly configAbsent: (root: string) => string;
+	readonly configsMultiple: (file: string) => string;
+	readonly optionsMisplaced: (keys: string) => string;
+	readonly optionsAtRoot: (keys: string) => string;
+	readonly optionsDuplicate: (keys: string) => string;
+	readonly optionsUnknown: (keys: string) => string;
+	readonly cssHash: string;
+	readonly controlledOptions: (plugin: string, keys: string) => string;
+	readonly missingCondition: (conditions: readonly string[]) => string;
+}
+
+export const ownMessages: Messages = {
+	configChangeDetected:
+		'Config file change detected, restart your dev process to apply the changes.',
+	configChanged: (file) => `config file changed: restarting vite server. - file: ${file}`,
+	noClientEnvironment:
+		'No client environment found, not adding watchers for config file and preprocessor dependencies',
+	configNotFound: (file) => `failed to find config file ${file}.`,
+	configAbsent: (root) => `no config file found at ${root} - using default configuration.`,
+	configsMultiple: (file) =>
+		`found more than one config file, using ${file}. you should only have one!`,
+	optionsMisplaced: (keys) =>
+		`Invalid options in config file. Move the following options into 'vitePlugin:{...}': ${keys}`,
+	optionsAtRoot: (keys) =>
+		`Invalid options in config file under vitePlugin:{...}', move them to the config root : ${keys}`,
+	optionsDuplicate: (keys) =>
+		`Invalid duplicate options in config file under vitePlugin:{...}', they are defined in root too and must only exist once: ${keys}`,
+	optionsUnknown: (keys) =>
+		`ignoring unknown plugin options in config file under vitePlugin:{...}: ${keys}`,
+	cssHash: 'The custom compilerOptions.cssHash in your config can degrade your DX.',
+	controlledOptions: (plugin, keys) =>
+		`The following compilerOptions are controlled by ${plugin} and essential to its functionality. User-specified values are ignored. Please remove them from your configuration: ${keys}`,
+	missingCondition: (conditions) =>
+		`The following packages have a ${conditions.join(' or ')} field in their package.json but no exports condition for it.`
+};