@md-plugins/vite-ssg-plugin 0.1.0-beta.26 → 0.1.0-beta.27

package/dist/index.mjs

@@ -1,6 +1,6 @@
 import { globSync } from 'tinyglobby';
 import { Buffer } from 'node:buffer';
-import { readFile, mkdir, writeFile } from 'node:fs/promises';
+import { readFile, mkdir, writeFile, readdir } from 'node:fs/promises';
 import { resolve, join, dirname } from 'node:path';
 
 function escapeJsonForHtml(json) {
@@ -158,6 +158,40 @@ async function readSsgRouteManifest(outDir, manifestFile) {
   const manifestJson = await readFile(join(outDir, manifestFile), "utf8");
   return JSON.parse(manifestJson);
 }
+function joinAssetHref(base, file) {
+  if (base === "./") {
+    return `./${file}`;
+  }
+  if (base.startsWith("http://") || base.startsWith("https://")) {
+    return `${base.replace(/\/$/, "")}/${file}`;
+  }
+  return `${base === "/" ? "" : base}/${file}`;
+}
+async function collectCssFiles(outDir, dir = "assets") {
+  const entries = await readdir(join(outDir, dir), {
+    withFileTypes: true
+  }).catch(() => []);
+  const files = [];
+  for (const entry of entries) {
+    const path = `${dir}/${entry.name}`;
+    if (entry.isDirectory()) {
+      files.push(...await collectCssFiles(outDir, path));
+    } else if (entry.isFile() && path.endsWith(".css")) {
+      files.push(path);
+    }
+  }
+  return files.sort();
+}
+async function injectMissingCssAssets(appHtml, outDir, base) {
+  const cssFiles = await collectCssFiles(outDir);
+  const missingLinks = cssFiles.map((file) => joinAssetHref(base, file)).filter((href) => !appHtml.includes(`href="${href}"`) && !appHtml.includes(`href=${href}`)).map((href) => `<link rel="stylesheet" crossorigin href="${href}">`);
+  if (missingLinks.length === 0) {
+    return appHtml;
+  }
+  const content = `${missingLinks.join("\n")}
+`;
+  return appHtml.includes("</head>") ? appHtml.replace("</head>", `${content}</head>`) : `${content}${appHtml}`;
+}
 async function prerenderSsgRoutes({
   outDir,
   appHtmlFile = "index.html",
@@ -169,7 +203,11 @@ async function prerenderSsgRoutes({
 }) {
   const resolvedOutDir = resolve(outDir);
   const resolvedManifest = manifest ?? await readSsgRouteManifest(resolvedOutDir, manifestFile);
-  const appHtml = await readFile(join(resolvedOutDir, appHtmlFile), "utf8");
+  const appHtml = await injectMissingCssAssets(
+    await readFile(join(resolvedOutDir, appHtmlFile), "utf8"),
+    resolvedOutDir,
+    resolvedManifest.base
+  );
   const routes = [];
   for (const [routeIndex, route] of resolvedManifest.routes.entries()) {
     const html = await renderSsgRouteHtml(

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@md-plugins/vite-ssg-plugin",
-  "version": "0.1.0-beta.26",
+  "version": "0.1.0-beta.27",
   "description": "A Vite plugin for @md-plugins static route inventory and future SSG output.",
   "keywords": [
     "markdown-it",