@eighty4/dank 0.0.4-2 → 0.0.4-3

package/lib_js/serve.js

@@ -1,148 +1,61 @@
-import { mkdir, readFile, rm, watch as _watch, writeFile } from "node:fs/promises";
-import { extname, join, resolve } from "node:path";
+import { mkdir, rm, writeFile } from "node:fs/promises";
+import { extname, join } from "node:path";
 import { buildWebsite } from "./build.js";
 import { loadConfig } from "./config.js";
 import { createGlobalDefinitions } from "./define.js";
 import { esbuildDevContext } from "./esbuild.js";
-import { resolveServeFlags } from "./flags.js";
-import { HtmlEntrypoint } from "./html.js";
 import { createBuiltDistFilesFetcher, createDevServeFilesFetcher, startWebServer } from "./http.js";
-import { WebsiteRegistry } from "./metadata.js";
+import { WebsiteRegistry } from "./registry.js";
 import { startDevServices, updateDevServices } from "./services.js";
-async function serveWebsite(c) {
-  const serve = resolveServeFlags(c);
-  await rm(serve.dirs.buildRoot, { force: true, recursive: true });
+import { watch } from "./watch.js";
+let c;
+async function serveWebsite() {
+  c = await loadConfig("serve", process.cwd());
+  await rm(c.dirs.buildRoot, { force: true, recursive: true });
   const abortController = new AbortController();
   process.once("exit", () => abortController.abort());
-  if (serve.preview) {
-    await startPreviewMode(c, serve, abortController.signal);
+  if (c.flags.preview) {
+    await startPreviewMode(abortController.signal);
   } else {
-    await startDevMode(c, serve, abortController.signal);
+    await startDevMode(abortController.signal);
   }
   return new Promise(() => {
   });
 }
-async function startPreviewMode(c, serve, signal) {
+async function startPreviewMode(signal) {
   const manifest = await buildWebsite(c);
-  const frontend = createBuiltDistFilesFetcher(serve.dirs.buildDist, manifest);
-  const devServices = startDevServices(c, signal);
-  startWebServer(serve, frontend, devServices.http, {
-    urls: Object.keys(c.pages),
-    urlRewrites: collectUrlRewrites(c)
-  });
-}
-function collectUrlRewrites(c) {
-  return Object.keys(c.pages).sort().map((url) => {
+  const frontend = createBuiltDistFilesFetcher(c.dirs, manifest);
+  const devServices = startDevServices(c.services, signal);
+  const urlRewrites = Object.keys(c.pages).sort().map((url) => {
     const mapping = c.pages[url];
     return typeof mapping !== "object" || !mapping.pattern ? null : { url, pattern: mapping.pattern };
   }).filter((mapping) => mapping !== null);
+  startWebServer(c.dankPort, c.flags, c.dirs, { urlRewrites }, frontend, devServices.http);
 }
-async function startDevMode(c, serve, signal) {
-  await mkdir(serve.dirs.buildWatch, { recursive: true });
-  const registry = new WebsiteRegistry(serve);
-  const clientJS = await loadClientJS(serve.esbuildPort);
-  const pagesByUrlPath = {};
-  const partialsByUrlPath = {};
-  const entryPointsByUrlPath = {};
+async function startDevMode(signal) {
+  const registry = new WebsiteRegistry(c);
+  await mkdir(c.dirs.buildWatch, { recursive: true });
   let buildContext = null;
-  registry.on("workers", () => {
-    resetBuildContext();
-  });
   watch("dank.config.ts", signal, async () => {
-    let updated;
     try {
-      updated = await loadConfig("serve");
+      await c.reload();
     } catch (ignore) {
       return;
     }
-    const prevPages = new Set(Object.keys(pagesByUrlPath));
-    await Promise.all(Object.entries(updated.pages).map(async ([urlPath, mapping]) => {
-      c.pages[urlPath] = mapping;
-      const srcPath = typeof mapping === "string" ? mapping : mapping.webpage;
-      if (!pagesByUrlPath[urlPath]) {
-        await addPage(urlPath, srcPath);
-      } else {
-        prevPages.delete(urlPath);
-        if (pagesByUrlPath[urlPath].fsPath !== srcPath) {
-          await updatePage(urlPath);
-        }
-      }
-    }));
-    for (const prevPage of Array.from(prevPages)) {
-      delete c.pages[prevPage];
-      deletePage(prevPage);
-    }
-    updateDevServices(updated);
+    registry.configSync();
+    updateDevServices(c.services);
   });
-  watch(serve.dirs.pages, signal, (filename) => {
+  watch(c.dirs.pages, signal, (filename) => {
     if (extname(filename) === ".html") {
-      for (const [urlPath, srcPath] of Object.entries(c.pages)) {
-        if (srcPath === filename) {
-          updatePage(urlPath);
-        }
-      }
-      for (const [urlPath, partials] of Object.entries(partialsByUrlPath)) {
-        if (partials.includes(filename)) {
-          updatePage(urlPath, filename);
+      registry.htmlEntrypoints.forEach((html) => {
+        if (html.fsPath === filename) {
+          html.emit("change");
+        } else if (html.usesPartial(filename)) {
+          html.emit("change", filename);
         }
-      }
+      });
     }
   });
-  await Promise.all(Object.entries(c.pages).map(async ([urlPath, mapping]) => {
-    const srcPath = typeof mapping === "string" ? mapping : mapping.webpage;
-    await addPage(urlPath, srcPath);
-    return new Promise((res) => pagesByUrlPath[urlPath].once("entrypoints", res));
-  }));
-  async function addPage(urlPath, srcPath) {
-    await mkdir(join(serve.dirs.buildWatch, urlPath), { recursive: true });
-    const htmlEntrypoint = pagesByUrlPath[urlPath] = new HtmlEntrypoint(serve, registry.resolver, urlPath, srcPath, [{ type: "script", js: clientJS }]);
-    htmlEntrypoint.on("entrypoints", (entrypoints) => {
-      const pathsIn = new Set(entrypoints.map((e) => e.in));
-      if (!entryPointsByUrlPath[urlPath] || !matchingEntrypoints(entryPointsByUrlPath[urlPath].pathsIn, pathsIn)) {
-        entryPointsByUrlPath[urlPath] = { entrypoints, pathsIn };
-        resetBuildContext();
-      }
-    });
-    htmlEntrypoint.on("partial", (partial) => {
-      if (!partialsByUrlPath[urlPath]) {
-        partialsByUrlPath[urlPath] = [];
-      }
-      partialsByUrlPath[urlPath].push(partial);
-    });
-    htmlEntrypoint.on("partials", (partials) => {
-      partialsByUrlPath[urlPath] = partials;
-    });
-    htmlEntrypoint.on("output", (html) => {
-      const path = join(serve.dirs.buildWatch, urlPath, "index.html");
-      writeFile(path, html);
-    });
-  }
-  function deletePage(urlPath) {
-    pagesByUrlPath[urlPath].removeAllListeners();
-    delete pagesByUrlPath[urlPath];
-    delete entryPointsByUrlPath[urlPath];
-    resetBuildContext();
-  }
-  async function updatePage(urlPath, partial) {
-    pagesByUrlPath[urlPath].emit("change", partial);
-  }
-  function collectEntrypoints() {
-    const unique = /* @__PURE__ */ new Set();
-    const pageBundles = Object.values(entryPointsByUrlPath).flatMap((entrypointState) => entrypointState.entrypoints).filter((entryPoint) => {
-      if (unique.has(entryPoint.in)) {
-        return false;
-      } else {
-        unique.add(entryPoint.in);
-        return true;
-      }
-    });
-    const workerBundles = registry.workerEntryPoints();
-    if (workerBundles) {
-      return [...pageBundles, ...workerBundles];
-    } else {
-      return pageBundles;
-    }
-  }
   function resetBuildContext() {
     switch (buildContext) {
       case "starting":
@@ -161,7 +74,7 @@ async function startDevMode(c, serve, signal) {
       });
     } else {
       buildContext = "starting";
-      startEsbuildWatch(c, registry, serve, collectEntrypoints()).then((ctx) => {
+      startEsbuildWatch(registry).then((ctx) => {
         if (buildContext === "dirty") {
           buildContext = "disposing";
           ctx.dispose().then(() => {
@@ -174,76 +87,39 @@ async function startDevMode(c, serve, signal) {
       });
     }
   }
+  registry.on("webpage", (html) => {
+    html.on("error", (e) => console.log(`\x1B[31merror:\x1B[0m`, e.message));
+    html.on("output", (output) => writeHtml(html, output));
+  });
+  registry.on("workers", () => {
+    resetBuildContext();
+  });
+  registry.configSync();
+  await Promise.all(registry.htmlEntrypoints.map((html) => html.process()));
+  registry.on("entrypoints", () => resetBuildContext());
   resetBuildContext();
-  const pageRoutes = {
-    get urls() {
-      return Object.keys(c.pages);
-    },
-    get urlRewrites() {
-      return collectUrlRewrites(c);
-    }
-  };
-  const frontend = createDevServeFilesFetcher(pageRoutes, serve);
-  const devServices = startDevServices(c, signal);
-  startWebServer(serve, frontend, devServices.http, pageRoutes);
+  const frontend = createDevServeFilesFetcher(c.esbuildPort, c.dirs, registry);
+  const devServices = startDevServices(c.services, signal);
+  startWebServer(c.dankPort, c.flags, c.dirs, registry, frontend, devServices.http);
 }
-function matchingEntrypoints(a, b) {
-  if (a.size !== b.size) {
-    return false;
-  }
-  for (const v in a) {
-    if (!b.has(v)) {
-      return false;
-    }
-  }
-  return true;
-}
-async function startEsbuildWatch(c, registry, serve, entryPoints) {
-  const ctx = await esbuildDevContext(serve, registry, createGlobalDefinitions(serve), entryPoints, c.esbuild);
+async function startEsbuildWatch(registry) {
+  const entryPoints = registry.webpageAndWorkerEntryPoints;
+  const ctx = await esbuildDevContext(registry, createGlobalDefinitions(c), entryPoints);
   await ctx.watch();
   await ctx.serve({
     host: "127.0.0.1",
-    port: serve.esbuildPort,
+    port: c.esbuildPort,
     cors: {
-      origin: ["127.0.0.1", "localhost"].map((hostname) => `http://${hostname}:${serve.dankPort}`)
+      origin: ["127.0.0.1", "localhost"].map((hostname) => `http://${hostname}:${c.dankPort}`)
     }
   });
   return ctx;
 }
-async function loadClientJS(esbuildPort) {
-  const clientJS = await readFile(resolve(import.meta.dirname, join("..", "client", "esbuild.js")), "utf-8");
-  return clientJS.replace("3995", `${esbuildPort}`);
-}
-async function watch(p, signal, fire) {
-  const delayFire = 90;
-  const timeout = 100;
-  let changes = {};
-  try {
-    for await (const { filename } of _watch(p, {
-      recursive: true,
-      signal
-    })) {
-      if (filename) {
-        if (!changes[filename]) {
-          const now = Date.now();
-          changes[filename] = now + delayFire;
-          setTimeout(() => {
-            const now2 = Date.now();
-            for (const [filename2, then] of Object.entries(changes)) {
-              if (then <= now2) {
-                fire(filename2);
-                delete changes[filename2];
-              }
-            }
-          }, timeout);
-        }
-      }
-    }
-  } catch (e) {
-    if (e.name !== "AbortError") {
-      throw e;
-    }
-  }
+async function writeHtml(html, output) {
+  const dir = join(c.dirs.buildWatch, html.url);
+  await mkdir(dir, { recursive: true });
+  const path = join(dir, "index.html");
+  await writeFile(path, output);
 }
 export {
   serveWebsite

package/lib_js/services.js

@@ -3,10 +3,10 @@ import { basename, isAbsolute, resolve } from "node:path";
 const running = [];
 let signal;
 let updating = null;
-function startDevServices(c, _signal) {
+function startDevServices(services, _signal) {
   signal = _signal;
-  if (c.services?.length) {
-    for (const s of c.services) {
+  if (services?.length) {
+    for (const s of services) {
       running.push({ s, process: startService(s) });
     }
   }
@@ -18,8 +18,8 @@ function startDevServices(c, _signal) {
     }
   };
 }
-function updateDevServices(c) {
-  if (!c.services?.length) {
+function updateDevServices(services) {
+  if (!services?.length) {
     if (running.length) {
       if (updating === null) {
         updating = { stopping: [], starting: [] };
@@ -39,7 +39,7 @@ function updateDevServices(c) {
     }
     const keep = [];
     const next = [];
-    for (const s of c.services) {
+    for (const s of services) {
       let found = false;
       for (let i = 0; i < running.length; i++) {
         const p = running[i].s;

package/lib_js/watch.js

@@ -0,0 +1,35 @@
+import { watch as createWatch } from "node:fs/promises";
+async function watch(p, signal, fire) {
+  const delayFire = 90;
+  const timeout = 100;
+  let changes = {};
+  try {
+    for await (const { filename } of createWatch(p, {
+      recursive: true,
+      signal
+    })) {
+      if (filename) {
+        if (!changes[filename]) {
+          const now = Date.now();
+          changes[filename] = now + delayFire;
+          setTimeout(() => {
+            const now2 = Date.now();
+            for (const [filename2, then] of Object.entries(changes)) {
+              if (then <= now2) {
+                fire(filename2);
+                delete changes[filename2];
+              }
+            }
+          }, timeout);
+        }
+      }
+    }
+  } catch (e) {
+    if (e.name !== "AbortError") {
+      throw e;
+    }
+  }
+}
+export {
+  watch
+};

package/lib_types/dank.d.ts

@@ -2,6 +2,7 @@ import type { Plugin as EsbuildPlugin } from 'esbuild';
 export type DankConfig = {
     esbuild?: EsbuildConfig;
     pages: Record<`/${string}`, `${string}.html` | PageMapping>;
+    devPages?: Record<`/__${string}`, `${string}.html` | DevPageMapping>;
     port?: number;
     previewPort?: number;
     services?: Array<DevService>;
@@ -10,6 +11,10 @@ export type PageMapping = {
     pattern?: RegExp;
     webpage: `${string}.html`;
 };
+export type DevPageMapping = {
+    label: string;
+    webpage: `${string}.html`;
+};
 export type DevService = {
     command: string;
     cwd?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eighty4/dank",
-  "version": "0.0.4-2",
+  "version": "0.0.4-3",
   "type": "module",
   "license": "MIT",
   "author": "Adam McKee Bennett <adam.be.g84d@gmail.com>",
@@ -37,18 +37,20 @@
     "typescript": "^5.9.2"
   },
   "files": [
-    "client/esbuild.js",
+    "client/client.js",
     "lib/*.ts",
     "lib_js/*.js",
     "lib_types/*.d.ts"
   ],
   "scripts": {
-    "build": "tsc && tsc -p tsconfig.client.json && tsc -p tsconfig.exports.json",
+    "build": "pnpm build:client && pnpm build:lib",
+    "build:client": "node scripts/build_client.ts",
+    "build:lib": "tsc && tsc -p tsconfig.exports.json",
     "build:release": "pnpm build && ./scripts/prepare_release.ts",
     "fmt": "prettier --write .",
     "fmtcheck": "prettier --check .",
     "test": "node --test \"test/**/*.test.ts\"",
     "test:rebuild": "pnpm build && pnpm test",
-    "typecheck": "tsc --noEmit"
+    "typecheck": "tsc --noEmit && tsc -p tsconfig.client.json --noEmit"
   }
 }

package/client/esbuild.js

@@ -1 +0,0 @@
-new EventSource("http://127.0.0.1:3995/esbuild").addEventListener("change",t=>{const{updated:i}=JSON.parse(t.data),e=new Set;for(const s of i)e.add(s);const c=Array.from(e).filter(s=>s.endsWith(".css"));if(c.length){console.log("esbuild css updates",c);const s={};for(const o of document.getElementsByTagName("link"))if(o.getAttribute("rel")==="stylesheet"){const n=new URL(o.href);(n.host=location.host)&&(s[n.pathname]=o)}let a=!1;for(const o of c){const n=s[o];if(n){const r=n.cloneNode();r.href=`${o}?${Math.random().toString(36).slice(2)}`,r.onload=()=>n.remove(),n.parentNode.insertBefore(r,n.nextSibling),a=!0}}a&&l()}if(c.length<e.size){const s=Array.from(e).filter(o=>!o.endsWith(".css")),a=new Set;for(const o of document.getElementsByTagName("script"))if(o.src.length){const n=new URL(o.src);(n.host=location.host)&&a.add(n.pathname)}s.some(o=>a.has(o))&&(console.log("esbuild js updates require reload"),p())}});function l(){const t=d("green","9999");t.style.opacity="0",t.animate([{opacity:0},{opacity:1},{opacity:1},{opacity:1},{opacity:.75},{opacity:.5},{opacity:.25},{opacity:0}],{duration:400,iterations:1,direction:"normal",easing:"linear"}),document.body.appendChild(t),Promise.all(t.getAnimations().map(i=>i.finished)).then(()=>t.remove())}function p(){const t=d("orange","9000");t.style.opacity="0",t.animate([{opacity:0},{opacity:1}],{duration:400,iterations:1,direction:"normal",easing:"ease-in"}),document.body.appendChild(t)}function d(t,i){const e=document.createElement("div");return e.style.border="6px dashed "+t,e.style.zIndex=i,e.style.position="fixed",e.style.top=e.style.left="1px",e.style.height=e.style.width="calc(100% - 2px)",e.style.boxSizing="border-box",e}export{l as addCssUpdateIndicator};