@ox-content/vite-plugin 0.17.0 → 1.0.0-alpha.0

package/dist/index.cjs

@@ -15,6 +15,7 @@ let shiki = require("shiki");
 let node_path = require("node:path");
 let fs = require("fs");
 fs = require_chunk.__toESM(fs);
+let node_crypto = require("node:crypto");
 let fs_promises = require("fs/promises");
 fs_promises = require_chunk.__toESM(fs_promises);
 let glob = require("glob");
@@ -9880,6 +9881,153 @@ async function generateHtmlPage(pageData, navGroups, siteName, base, ogImage, th
 		theme: themeForRust
 	});
 }
+const SSG_STYLE_BLOCK_RE = /[ \t]*<!-- ox-content:styles:start -->\s*<style>([\s\S]*?)<\/style>\s*<!-- ox-content:styles:end -->/;
+const SSG_SCRIPT_BLOCK_RE = /[ \t]*<!-- ox-content:scripts:start -->\s*<script>([\s\S]*?)<\/script>\s*<!-- ox-content:scripts:end -->/;
+const FIRST_INLINE_STYLE_RE = /[ \t]*<style>([\s\S]*?)<\/style>/;
+const LAST_INLINE_BODY_SCRIPT_RE = /[ \t]*<script>([\s\S]*?)<\/script>\s*<\/body>/;
+const CSS_SECTION_RE = /\/\* ox-content:css:([a-z0-9-]+):start \*\/\s*([\s\S]*?)\s*\/\* ox-content:css:\1:end \*\//g;
+const SEARCH_CHUNK_RE = /\/\/ ox-content:search:start\s*([\s\S]*?)\s*\/\/ ox-content:search:end/;
+const SEARCH_CHUNK_PLACEHOLDER = "__OX_CONTENT_SEARCH_CHUNK__";
+const CORE_CSS_SECTION_NAMES = new Set(["base", "footer"]);
+const THEME_INLINE_CSS_MAX_BYTES = 2048;
+function createContentHash(content) {
+	return (0, node_crypto.createHash)("sha256").update(content).digest("hex").slice(0, 10);
+}
+function sanitizeChunkLabel(label) {
+	return label.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "") || "asset";
+}
+function toPublicAssetPath(base, fileName) {
+	return `${base.endsWith("/") ? base : `${base}/`}assets/${fileName}`;
+}
+function hasRelativeCssUrls(css) {
+	let cursor = 0;
+	while (cursor < css.length) {
+		const urlIndex = css.indexOf("url(", cursor);
+		if (urlIndex === -1) return false;
+		let valueStart = urlIndex + 4;
+		while (valueStart < css.length && /\s/.test(css[valueStart])) valueStart++;
+		const quote = css[valueStart] === "\"" || css[valueStart] === "'" ? css[valueStart] : "";
+		if (quote) valueStart++;
+		let valueEnd = valueStart;
+		while (valueEnd < css.length) {
+			const char = css[valueEnd];
+			if (quote) {
+				if (char === "\\") {
+					valueEnd += 2;
+					continue;
+				}
+				if (char === quote) break;
+			} else if (char === ")") break;
+			valueEnd++;
+		}
+		const value = css.slice(valueStart, valueEnd).trim();
+		if (value && !value.startsWith("data:") && !value.startsWith("http:") && !value.startsWith("https:") && !value.startsWith("//") && !value.startsWith("/") && !value.startsWith("#") && !value.startsWith("blob:") && !value.startsWith("var(")) return true;
+		cursor = valueEnd + 1;
+	}
+	return false;
+}
+function createSharedAssetChunk(type, label, content, outDir, base) {
+	const hash = createContentHash(content);
+	const fileName = `ox-content-${sanitizeChunkLabel(label)}-${hash}.${type}`;
+	return {
+		outputPath: path$1.join(outDir, "assets", fileName),
+		publicPath: toPublicAssetPath(base, fileName),
+		content
+	};
+}
+function extractCssSections(cssContent) {
+	return Array.from(cssContent.matchAll(CSS_SECTION_RE)).map(([, name, content]) => ({
+		name,
+		content: content.trim()
+	})).filter((section) => section.content.length > 0);
+}
+function getOrCreateSharedChunk(chunks, type, label, content, outDir, base) {
+	let chunk = chunks.get(content);
+	if (!chunk) {
+		chunk = createSharedAssetChunk(type, label, content, outDir, base);
+		chunks.set(content, chunk);
+	}
+	return chunk;
+}
+function buildStyleReplacement(cssContent, cssChunks, outDir, base) {
+	const sections = extractCssSections(cssContent);
+	const effectiveSections = sections.length > 0 ? sections : [{
+		name: "css",
+		content: cssContent.trim()
+	}];
+	const coreContent = effectiveSections.filter((section) => CORE_CSS_SECTION_NAMES.has(section.name)).map((section) => section.content).join("\n").trim();
+	const fragments = [];
+	if (coreContent) {
+		const coreChunk = getOrCreateSharedChunk(cssChunks, "css", "core", coreContent, outDir, base);
+		fragments.push(`  <link rel="stylesheet" href="${coreChunk.publicPath}">`);
+	}
+	for (const section of effectiveSections) {
+		if (CORE_CSS_SECTION_NAMES.has(section.name)) continue;
+		if (section.name === "theme" && (hasRelativeCssUrls(section.content) || section.content.length <= THEME_INLINE_CSS_MAX_BYTES) || hasRelativeCssUrls(section.content)) {
+			fragments.push(`  <style>${section.content}</style>`);
+			continue;
+		}
+		const chunk = getOrCreateSharedChunk(cssChunks, "css", section.name, section.content, outDir, base);
+		fragments.push(`  <link rel="stylesheet" href="${chunk.publicPath}">`);
+	}
+	return fragments.join("\n");
+}
+function buildScriptReplacement(jsContent, jsChunks, outDir, base) {
+	const searchMatch = jsContent.match(SEARCH_CHUNK_RE);
+	if (searchMatch && jsContent.includes(SEARCH_CHUNK_PLACEHOLDER)) {
+		const searchContent = searchMatch[1].trim();
+		if (searchContent) {
+			const searchChunk = getOrCreateSharedChunk(jsChunks, "js", "search", searchContent, outDir, base);
+			const coreContent = jsContent.replace(SEARCH_CHUNK_RE, "").replaceAll(SEARCH_CHUNK_PLACEHOLDER, searchChunk.publicPath).trim();
+			if (coreContent) return `  <script defer src="${getOrCreateSharedChunk(jsChunks, "js", "core", coreContent, outDir, base).publicPath}"><\/script>`;
+		}
+	}
+	const fallbackContent = jsContent.trim();
+	if (!fallbackContent) return "";
+	return `  <script defer src="${getOrCreateSharedChunk(jsChunks, "js", "js", fallbackContent, outDir, base).publicPath}"><\/script>`;
+}
+async function externalizeSharedPageAssets(pages, outDir, base) {
+	const cssChunks = /* @__PURE__ */ new Map();
+	const jsChunks = /* @__PURE__ */ new Map();
+	const optimizedPages = pages.map((page) => {
+		let html = page.html;
+		const styleMatch = html.match(SSG_STYLE_BLOCK_RE);
+		if (styleMatch) {
+			const replacement = buildStyleReplacement(styleMatch[1], cssChunks, outDir, base);
+			html = html.replace(SSG_STYLE_BLOCK_RE, replacement);
+		} else {
+			const inlineStyleMatch = html.match(FIRST_INLINE_STYLE_RE);
+			if (inlineStyleMatch) {
+				const replacement = buildStyleReplacement(inlineStyleMatch[1], cssChunks, outDir, base);
+				html = html.replace(FIRST_INLINE_STYLE_RE, replacement);
+			}
+		}
+		const scriptMatch = html.match(SSG_SCRIPT_BLOCK_RE);
+		if (scriptMatch) {
+			const replacement = buildScriptReplacement(scriptMatch[1], jsChunks, outDir, base);
+			html = html.replace(SSG_SCRIPT_BLOCK_RE, replacement);
+		} else {
+			const inlineScriptMatch = html.match(LAST_INLINE_BODY_SCRIPT_RE);
+			if (inlineScriptMatch) {
+				const replacement = buildScriptReplacement(inlineScriptMatch[1], jsChunks, outDir, base);
+				html = html.replace(LAST_INLINE_BODY_SCRIPT_RE, replacement ? `${replacement}\n</body>` : "</body>");
+			}
+		}
+		return {
+			...page,
+			html
+		};
+	});
+	const chunks = [...cssChunks.values(), ...jsChunks.values()];
+	await Promise.all(chunks.map(async (chunk) => {
+		await fs_promises.mkdir(path$1.dirname(chunk.outputPath), { recursive: true });
+		await fs_promises.writeFile(chunk.outputPath, chunk.content, "utf-8");
+	}));
+	return {
+		pages: optimizedPages,
+		assets: chunks.map((chunk) => chunk.outputPath)
+	};
+}
 /**
 * Converts a markdown file path to its corresponding HTML output path.
 */
@@ -10024,6 +10172,7 @@ async function buildSsg(options, root) {
 	const outDir = path$1.resolve(root, options.outDir);
 	const base = options.base.endsWith("/") ? options.base : options.base + "/";
 	const generatedFiles = [];
+	const generatedPages = [];
 	const errors = [];
 	if (ssgOptions.clean) try {
 		await fs_promises.rm(outDir, {
@@ -10137,13 +10286,22 @@ async function buildSsg(options, root) {
 			entryPage
 		}, navItems, siteName, base, pageOgImage, ssgOptions.theme);
 		const outputPath = getOutputPath(inputPath, srcDir, outDir, ssgOptions.extension);
-		await fs_promises.mkdir(path$1.dirname(outputPath), { recursive: true });
-		await fs_promises.writeFile(outputPath, html, "utf-8");
-		generatedFiles.push(outputPath);
+		generatedPages.push({
+			inputPath,
+			outputPath,
+			html
+		});
 	} catch (err) {
 		const errorMessage = err instanceof Error ? err.message : String(err);
 		errors.push(`Failed to generate HTML for ${pageResult.inputPath}: ${errorMessage}`);
 	}
+	const optimizedOutput = await externalizeSharedPageAssets(generatedPages, outDir, base);
+	generatedFiles.push(...optimizedOutput.assets);
+	for (const page of optimizedOutput.pages) {
+		await fs_promises.mkdir(path$1.dirname(page.outputPath), { recursive: true });
+		await fs_promises.writeFile(page.outputPath, page.html, "utf-8");
+		generatedFiles.push(page.outputPath);
+	}
 	return {
 		files: generatedFiles,
 		errors
@@ -11920,7 +12078,7 @@ function oxContent(options = {}) {
 			const root = config?.root || process.cwd();
 			try {
 				const result = await buildSsg(resolvedOptions, root);
-				if (result.files.length > 0) console.log(`[ox-content] Generated ${result.files.length} HTML files`);
+				if (result.files.length > 0) console.log(`[ox-content] Generated ${result.files.length} output files`);
 				if (result.errors.length > 0) for (const error of result.errors) console.warn(`[ox-content] ${error}`);
 			} catch (err) {
 				console.error("[ox-content] SSG build failed:", err);