@pracht/vite-plugin 0.7.0 → 0.7.1

package/dist/index.d.mts

@@ -28,7 +28,8 @@ interface EnvLeakReference {
 }
 /**
  * Scans JavaScript source for references to environment variables that are
- * neither public-prefixed, Vite built-ins, nor explicitly allowed.
+ * neither public-prefixed, Vite built-ins, nor explicitly allowed, plus reads
+ * that pull in the whole `import.meta.env` object.
  */
 declare function scanCodeForEnvLeaks(code: string, allow?: ReadonlySet<string>): EnvLeakReference[];
 interface EnvLeakProblem extends EnvLeakReference {

package/dist/index.mjs

@@ -3,7 +3,7 @@ import { createRequire } from "node:module";
 import { preactSsrPrecompile } from "@pracht/preact-ssr-precompile";
 import preact from "@preact/preset-vite";
 import { dirname, extname, join, resolve } from "node:path";
-import { parseAst } from "vite";
+import { loadEnv, parseAst } from "vite";
 import { existsSync, readFileSync, readdirSync, statSync } from "node:fs";
 import { CAPABILITY_SETTLED_EVENT, CAPABILITY_TRANSPORT_HEADER, CONFIRMATION_HEADER, capabilityHttpPath, isValidCapabilityHttpPath } from "@pracht/capabilities";
 import { evaluateLiteral, extractCapabilityRegistrations, extractDefineCapabilityArgs, scanTopLevelProperties } from "@pracht/capabilities/static";
@@ -909,30 +909,51 @@ const VITE_BUILTIN_ENV_VARS = new Set([
 const PUBLIC_ENV_PREFIX = "PRACHT_PUBLIC_";
 /** Server-only core entry that must never resolve into client bundles. */
 const SERVER_ENV_MODULE_ID = "@pracht/core/env/server";
-const ENV_REFERENCE_RE = /\b(process\.env|import\.meta\.env)(?:\.([A-Za-z_$][A-Za-z0-9_$]*)|\[\s*(["'])([A-Za-z_$][A-Za-z0-9_$]*)\3\s*\])/g;
+const ENV_REFERENCE_RE = /\b(process\.env|import\.meta\.env)(?:\??\.([A-Za-z_$][A-Za-z0-9_$]*)|(?:\?\.)?\[\s*(["'])([A-Za-z_$][A-Za-z0-9_$]*)\3\s*\])/g;
+const WHOLE_ENV_READ_RE = /\bimport\.meta\.env\b(?!\s*\??\.\s*[A-Za-z_$])/g;
 /**
 * Scans JavaScript source for references to environment variables that are
-* neither public-prefixed, Vite built-ins, nor explicitly allowed.
+* neither public-prefixed, Vite built-ins, nor explicitly allowed, plus reads
+* that pull in the whole `import.meta.env` object.
 */
 function scanCodeForEnvLeaks(code, allow = /* @__PURE__ */ new Set()) {
-	const findings = [];
-	const seen = /* @__PURE__ */ new Set();
 	const codePositions = getCodePositionMask(code);
+	const matches = [];
 	for (const match of code.matchAll(ENV_REFERENCE_RE)) {
-		if (!codePositions[match.index ?? -1]) continue;
+		const index = match.index ?? -1;
+		if (!codePositions[index]) continue;
 		const accessor = match[1];
 		const name = match[2] ?? match[4];
 		if (!name) continue;
 		if (name.startsWith("PRACHT_PUBLIC_")) continue;
 		if (VITE_BUILTIN_ENV_VARS.has(name)) continue;
 		if (allow.has(name)) continue;
-		const key = `${accessor}.${name}`;
+		matches.push({
+			index,
+			reference: {
+				accessor,
+				name
+			}
+		});
+	}
+	if (!allow.has("*")) for (const match of code.matchAll(WHOLE_ENV_READ_RE)) {
+		const index = match.index ?? -1;
+		if (!codePositions[index]) continue;
+		matches.push({
+			index,
+			reference: {
+				accessor: "import.meta.env",
+				name: "*"
+			}
+		});
+	}
+	const findings = [];
+	const seen = /* @__PURE__ */ new Set();
+	for (const { reference } of matches.sort((a, b) => a.index - b.index)) {
+		const key = `${reference.accessor}.${reference.name}`;
 		if (seen.has(key)) continue;
 		seen.add(key);
-		findings.push({
-			accessor,
-			name
-		});
+		findings.push(reference);
 	}
 	return findings;
 }
@@ -1103,12 +1124,20 @@ function isIdentifierChar(char) {
 	return !!char && /[A-Za-z0-9_$]/.test(char);
 }
 function formatEnvLeakError(problems) {
+	const lines = problems.map((problem) => {
+		const source = problem.sources.length > 0 ? ` (likely from ${problem.sources.map((file) => JSON.stringify(file)).join(", ")})` : "";
+		return `  - ${problem.name === "*" ? "import.meta.env read as a whole object" : `${problem.accessor}.${problem.name}`} in chunk "${problem.chunk}"${source}`;
+	});
+	const wholeEnvGuidance = problems.some((problem) => problem.name === "*") ? [
+		"",
+		"A whole-object `import.meta.env` read (bare reference, destructuring, spread, or bracket access)",
+		"is replaced at build time by an object literal containing every exposed variable — including the",
+		"`VITE_` values Pracht does not treat as public. Read one key at a time (`import.meta.env.KEY`)."
+	] : [];
 	return [
 		"[pracht] Environment variable leak detected in the client bundle:",
-		...problems.map((problem) => {
-			const source = problem.sources.length > 0 ? ` (likely from ${problem.sources.map((file) => JSON.stringify(file)).join(", ")})` : "";
-			return `  - ${problem.accessor}.${problem.name} in chunk "${problem.chunk}"${source}`;
-		}),
+		...lines,
+		...wholeEnvGuidance,
 		"",
 		`Only PRACHT_PUBLIC_-prefixed variables may be referenced in client code (prefer publicEnv from "@pracht/core" for typed public values).`,
 		`Move server-only reads into loaders/API routes and access them via serverEnv from "@pracht/core/env/server",`,
@@ -1193,6 +1222,7 @@ function createEnvSafetyPlugin(envSafety) {
 //#region src/plugin-assets.ts
 const PRACHT_CLIENT_MODULE_ID = "virtual:pracht/client";
 const PRACHT_SERVER_MODULE_ID = "virtual:pracht/server";
+const PRACHT_DEV_MODULE_ID = "virtual:pracht/dev-metadata";
 const PRACHT_ISLANDS_CLIENT_MODULE_ID = "virtual:pracht/islands-client";
 const PRACHT_CAPABILITIES_MODULE_ID = "virtual:pracht/capabilities";
 const PRACHT_WEBMCP_MODULE_ID = "virtual:pracht/webmcp";
@@ -1258,6 +1288,9 @@ function isClientModule(id) {
 function isServerModule(id) {
 	return id === "virtual:pracht/server" || id.endsWith("virtual:pracht/server");
 }
+function isDevModule(id) {
+	return id === "virtual:pracht/dev-metadata" || id.endsWith("virtual:pracht/dev-metadata");
+}
 function isIslandsClientModule(id) {
 	return id === "virtual:pracht/islands-client" || id === "/@pracht/islands.js" || id.endsWith("virtual:pracht/islands-client");
 }
@@ -1891,6 +1924,23 @@ function createPrachtServerModuleSource(options = {}, buildOptions = {}) {
 	return source.join("\n");
 }
 /**
+* Adapter-neutral app metadata used by development tooling. Keeping this
+* separate from the server entry avoids evaluating worker-only imports (for
+* example `cloudflare:workers`) in Vite's Node SSR environment.
+*/
+function createPrachtDevModuleSource(options = {}, buildOptions = {}) {
+	const resolved = resolveOptions(options);
+	return [
+		"import { resolveApp } from \"@pracht/core/server\";",
+		resolved.pagesDir ? generatePagesAppInlineSource(resolved, buildOptions.root) : `import { app } from ${JSON.stringify(resolved.appFile)};`,
+		"",
+		createPrachtRegistryModuleSource(resolved),
+		"",
+		"export const resolvedApp = resolveApp(app);",
+		""
+	].join("\n");
+}
+/**
 * Fill llms.txt title/description from the app's package.json when the user
 * did not set them explicitly. Returns null when the feature is disabled so
 * the server module codegen stays byte-for-byte unchanged.
@@ -1995,6 +2045,7 @@ function generatePagesAppInlineSource(options, root = process.cwd()) {
 //#region src/plugin-dev-ssr.ts
 const BODYLESS_METHODS = new Set(["GET", "HEAD"]);
 const DEFAULT_MAX_BODY_SIZE = 1024 * 1024;
+const CSS_MODULE_URL_RE = /\.(?:css|less|sass|scss|styl|stylus|pcss|postcss|sss)(?:$|\?)/;
 const DEVTOOLS_JSON_PATH = "/_pracht.json";
 const LLMS_TXT_PATH = "/llms.txt";
 function createDevSSRMiddleware(server, options = {}) {
@@ -2080,6 +2131,154 @@ function createDevSSRMiddleware(server, options = {}) {
 	};
 }
 /**
+* Build the development equivalent of the production CSS manifest for the
+* current route. Vite turns CSS imports into client-side style injection by
+* default; resolving the same imports through the active server environment
+* graphs lets pracht put real stylesheet links in the initial document and
+* avoid a first-paint FOUC.
+*/
+async function createDevCssManifest(server, options) {
+	const route = options.matchAppRoute(options.app, options.pathname)?.route ?? options.app.notFound;
+	if (!route) return {};
+	const manifest = {};
+	const modules = [...route.shellFile ? [{
+		file: route.shellFile,
+		registry: options.registry.shellModules
+	}] : [], {
+		file: route.file,
+		registry: options.registry.routeModules
+	}];
+	const results = await Promise.all(modules.map(async ({ file, registry }) => {
+		if (!registry) return {
+			file,
+			urls: []
+		};
+		const moduleKey = findRegistryModuleKey(registry, file);
+		if (!moduleKey) return {
+			file,
+			urls: []
+		};
+		const entries = await Promise.all(Object.values(server.environments).map((environment) => environment.moduleGraph.getModuleByUrl(moduleKey)));
+		return {
+			file,
+			urls: [...new Set(entries.flatMap((entry) => collectDevCssUrls(entry)))]
+		};
+	}));
+	for (const { file, urls } of results) if (urls.length > 0) manifest[file] = urls;
+	return manifest;
+}
+function findRegistryModuleKey(modules, file) {
+	if (!modules) return void 0;
+	if (file in modules) return file;
+	const suffix = `/${file.split("?")[0].replace(/\\/g, "/").replace(/^\.?\//, "")}`;
+	return Object.keys(modules).find((key) => key.split("?")[0].replace(/\\/g, "/").endsWith(suffix));
+}
+function collectDevCssUrls(entry) {
+	if (!entry) return [];
+	const urls = /* @__PURE__ */ new Set();
+	const visited = /* @__PURE__ */ new Set();
+	const pending = [entry];
+	while (pending.length > 0) {
+		const module = pending.pop();
+		if (visited.has(module)) continue;
+		visited.add(module);
+		if ((module.type === "css" || CSS_MODULE_URL_RE.test(module.url)) && !/[?&](?:inline|raw|url)(?:[=&]|$)/.test(module.url)) urls.add(module.url);
+		pending.push(...[...module.importedModules].reverse());
+	}
+	return [...urls];
+}
+function injectDevCssLinks(html, manifest) {
+	if (!html.includes("</head>")) return html;
+	const tags = [...new Set(Object.values(manifest).flat())].map((url) => escapeHtmlAttribute(url)).filter((escapedUrl) => !html.includes(`href="${escapedUrl}"`)).map((escapedUrl) => `<link rel="stylesheet" href="${escapedUrl}">`);
+	if (tags.length === 0) return html;
+	return html.replace("</head>", `    ${tags.join("\n    ")}\n  </head>`);
+}
+async function injectDevCssForPath(server, path, html) {
+	return injectDevCssLinks(html, await createDevCssManifest(server, await resolveDevCssContextForPath(server, path)));
+}
+async function resolveDevCssContextForPath(server, path) {
+	const [framework, serverMod] = await Promise.all([server.ssrLoadModule("@pracht/core/server"), server.ssrLoadModule(PRACHT_DEV_MODULE_ID)]);
+	const pathname = new URL(path, "http://localhost").pathname;
+	return {
+		app: serverMod.resolvedApp,
+		matchAppRoute: framework.matchAppRoute,
+		pathname,
+		registry: serverMod.registry
+	};
+}
+/**
+* Adapter-owned dev servers (for example Cloudflare's worker runtime) bypass
+* Vite's HTML transform hooks. Install this before the adapter middleware so
+* document responses still receive the same parser-blocking stylesheet links.
+*/
+function createDevCssInjectionMiddleware(server) {
+	let warned = false;
+	return (req, res, next) => {
+		const method = (req.method ?? "GET").toUpperCase();
+		const accept = readRequestHeader(req.headers.accept).toLowerCase();
+		if (method !== "GET" || !accept.includes("text/html")) {
+			next();
+			return;
+		}
+		const contextPromise = resolveDevCssContextForPath(server, req.url ?? "/").catch((error) => {
+			if (!warned) {
+				warned = true;
+				server.config.logger.warn(`[pracht] Could not discover development stylesheets: ${error instanceof Error ? error.message : String(error)}`);
+			}
+			return null;
+		});
+		const chunks = [];
+		const originalEnd = res.end.bind(res);
+		const originalWriteHead = res.writeHead.bind(res);
+		res.writeHead = ((statusCode, ...args) => {
+			res.removeHeader("content-length");
+			return Reflect.apply(originalWriteHead, res, [statusCode, ...args.map(stripContentLengthHeader)]);
+		});
+		res.write = ((chunk, encodingOrCallback, callback) => {
+			chunks.push(toBuffer(chunk, encodingOrCallback));
+			(typeof encodingOrCallback === "function" ? encodingOrCallback : typeof callback === "function" ? callback : void 0)?.();
+			return true;
+		});
+		res.end = ((chunk, encodingOrCallback, callback) => {
+			if (chunk != null) chunks.push(toBuffer(chunk, encodingOrCallback));
+			const done = typeof encodingOrCallback === "function" ? encodingOrCallback : typeof callback === "function" ? callback : void 0;
+			(async () => {
+				const body = Buffer.concat(chunks);
+				if (!String(res.getHeader("content-type") ?? "").includes("text/html")) {
+					originalEnd(body, done);
+					return;
+				}
+				try {
+					const context = await contextPromise;
+					const manifest = context ? await createDevCssManifest(server, context) : null;
+					originalEnd(manifest ? injectDevCssLinks(body.toString("utf-8"), manifest) : body.toString("utf-8"), done);
+				} catch {
+					originalEnd(body, done);
+				}
+			})();
+			return res;
+		});
+		next();
+	};
+}
+function toBuffer(chunk, encoding) {
+	if (Buffer.isBuffer(chunk)) return chunk;
+	if (chunk instanceof Uint8Array) return Buffer.from(chunk);
+	return Buffer.from(String(chunk), typeof encoding === "string" ? encoding : void 0);
+}
+function stripContentLengthHeader(value) {
+	if (Array.isArray(value)) {
+		const headers = [];
+		for (let index = 0; index < value.length; index += 2) if (String(value[index]).toLowerCase() !== "content-length") headers.push(value[index], value[index + 1]);
+		return headers;
+	}
+	if (value && typeof value === "object") return Object.fromEntries(Object.entries(value).filter(([name]) => name.toLowerCase() !== "content-length"));
+	return value;
+}
+function escapeHtmlAttribute(value) {
+	return value.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+}
+/**
 * Serve the dev-only `/_pracht` devtools page (or `/_pracht.json`) built from
 * the same resolved app graph that `pracht inspect` reports.
 */
@@ -2295,9 +2494,12 @@ function pracht(options = {}) {
 			const isSSRBuild = env.isSsrBuild;
 			const configRoot = _config.root ?? process.cwd();
 			const wantsIslandsEntry = env.command === "build" && !isSSRBuild && existsSync(resolveConfigPath(configRoot, resolved.islandsDir));
+			const envDir = _config.envDir ? resolve(configRoot, _config.envDir) : configRoot;
+			const publicEnvDefine = JSON.stringify(loadEnv(env.mode, envDir, PUBLIC_ENV_PREFIX));
 			return {
 				appType: "custom",
 				envPrefix: ["VITE_", PUBLIC_ENV_PREFIX],
+				define: { __PRACHT_PUBLIC_ENV__: publicEnvDefine },
 				...isSSRBuild ? {} : { build: { rollupOptions: {
 					...wantsIslandsEntry ? { input: [PRACHT_ISLANDS_CLIENT_MODULE_ID] } : {},
 					output: { manualChunks(id) {
@@ -2321,6 +2523,7 @@ function pracht(options = {}) {
 		resolveId(id, importer, resolveIdOptions) {
 			if (isIslandsClientModule(id)) return PRACHT_ISLANDS_CLIENT_MODULE_ID;
 			if (isClientModule(id)) return PRACHT_CLIENT_MODULE_ID;
+			if (isDevModule(id)) return PRACHT_DEV_MODULE_ID;
 			if (isServerModule(id)) return PRACHT_SERVER_MODULE_ID;
 			if (isCapabilitiesModule(id)) return PRACHT_CAPABILITIES_MODULE_ID;
 			if (isWebmcpModule(id)) return PRACHT_WEBMCP_MODULE_ID;
@@ -2330,6 +2533,7 @@ function pracht(options = {}) {
 		load(id) {
 			if (isIslandsClientModule(id)) return createPrachtIslandsClientModuleSource(resolved, { root });
 			if (isClientModule(id)) return createPrachtClientModuleSource(resolved, { root });
+			if (isDevModule(id)) return createPrachtDevModuleSource(resolved, { root });
 			if (isServerModule(id)) return createPrachtServerModuleSource(resolved, {
 				root,
 				isBuild
@@ -2350,7 +2554,10 @@ function pracht(options = {}) {
 		},
 		configureServer(server) {
 			if (isPagesMode) watchPagesDirectory(server, resolved, root);
-			if (resolved.adapter.ownsDevServer) return;
+			if (resolved.adapter.ownsDevServer) {
+				server.middlewares.use(createDevCssInjectionMiddleware(server));
+				return;
+			}
 			return () => {
 				server.middlewares.use(createDevSSRMiddleware(server, {
 					llmsTxt: !!resolved.llmsTxt,
@@ -2358,6 +2565,14 @@ function pracht(options = {}) {
 				}));
 			};
 		},
+		async transformIndexHtml(html, context) {
+			if (isBuild || !context.server || !html.includes("</head>")) return html;
+			try {
+				return await injectDevCssForPath(context.server, context.path, html);
+			} catch {
+				return html;
+			}
+		},
 		handleHotUpdate({ file, server }) {
 			const serverRoot = toPosixPath(server.config.root);
 			const normalizedFile = toPosixPath(file);
@@ -2382,6 +2597,8 @@ function pracht(options = {}) {
 			].some((dir) => relative.startsWith(dir))) {
 				const serverMod = server.moduleGraph.getModuleById(PRACHT_SERVER_MODULE_ID);
 				if (serverMod) server.moduleGraph.invalidateModule(serverMod);
+				const devMod = server.moduleGraph.getModuleById(PRACHT_DEV_MODULE_ID);
+				if (devMod) server.moduleGraph.invalidateModule(devMod);
 				if (relative.startsWith(resolved.routesDir)) {
 					const clientMod = server.moduleGraph.getModuleById(PRACHT_CLIENT_MODULE_ID);
 					if (clientMod) server.moduleGraph.invalidateModule(clientMod);
@@ -2520,8 +2737,10 @@ function watchPagesDirectory(server, resolved, root) {
 function invalidateVirtualModules(server) {
 	const clientMod = server.moduleGraph.getModuleById(PRACHT_CLIENT_MODULE_ID);
 	const serverMod = server.moduleGraph.getModuleById(PRACHT_SERVER_MODULE_ID);
+	const devMod = server.moduleGraph.getModuleById(PRACHT_DEV_MODULE_ID);
 	if (clientMod) server.moduleGraph.invalidateModule(clientMod);
 	if (serverMod) server.moduleGraph.invalidateModule(serverMod);
+	if (devMod) server.moduleGraph.invalidateModule(devMod);
 }
 const ROUTE_FILE_EXTENSIONS = new Set([
 	".ts",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pracht/vite-plugin",
-  "version": "0.7.0",
+  "version": "0.7.1",
   "description": "Vite plugin for Pracht apps with virtual modules, dev SSR, prerendering, route inspection, and multi-adapter builds.",
   "keywords": [
     "pracht",
@@ -44,10 +44,10 @@
   "dependencies": {
     "@preact/preset-vite": "^2.10.5",
     "@prefresh/vite": "^2.0.0",
-    "@pracht/adapter-node": "0.3.3",
-    "@pracht/core": "0.11.0",
-    "@pracht/preact-ssr-precompile": "0.1.2",
-    "@pracht/capabilities": "0.1.0"
+    "@pracht/adapter-node": "0.3.4",
+    "@pracht/core": "0.11.1",
+    "@pracht/capabilities": "0.1.0",
+    "@pracht/preact-ssr-precompile": "0.1.2"
   },
   "peerDependencies": {
     "vite": "^8.0.0"