lecodes-cli 2.4.1 → 2.4.3

package/src/compile/screenEntry.ts

@@ -1,123 +1,123 @@
-import { existsSync, readFileSync, statSync } from "node:fs"
-import { isAbsolute, join, relative, resolve } from "node:path"
-import { screenFrame } from "../project/designMeta"
-import { CliError } from "../cli"
-import { toKey } from "../project/paths"
-import type { CompileEntry } from "./projectCompile"
-
-/*
- * Rendering ONE screen module instead of the whole app — `lecodes render <file>` (and
- * `--desktop`). A design screen (`design/screens/login.ts`) never boots itself: it default-exports
- * a `UIScreen`, or a `(state) => UIScreen` function for its states, and the design board / snapshot
- * supply the `.open()`. This builds the same virtual entry for the normal project pipeline, so any
- * file written that way — inside design/ or not — renders with the full `lecodes render` flag set
- * (--png/--clip/--script/--device/…) against the project's real imports and assets.
- *
- * Kept in step with compile/designCompile.ts, which does the same wrapping per screen for the board.
- */
-
-/** Extensions a screen module may carry (so `render design/screens/login` works too). */
-const SCREEN_EXTS = [".ts", ".tsx", ".js", ".jsx", ".mjs"]
-
-/** Where the generated entry lives — the project root, so its import specifier is the screen's
- *  own project key ("./design/screens/login"). Leading dot: never a real project file. */
-const SCREEN_ENTRY_PATH = "/.screen-entry.ts"
-
-/** The design folder a bare screen id (`lecodes render login`) is looked up in. */
-const DEFAULT_DESIGN_DIR = "design"
-
-export type ScreenTarget = {
-  /** The virtual entry module — hand it to the compiler alongside the project's own entries. */
-  entry: CompileEntry
-  /** Path of that entry, for `entryOverride`. */
-  entryPath: string
-  /** The board frame from the design folder's meta.json, when this IS a design screen. */
-  frame?: [number, number]
-  /** How the screen is named in progress notes ("design/screens/login.ts", "login@empty"). */
-  label: string
-}
-
-/** `lecodes render <file|screen-id>` — the positional a screen render is asked for by. */
-
-/** Whether the argument names a path at all (vs a bare screen id). */
-const hasSeparator = (file: string) => file.includes("/") || file.includes("\\")
-
-/** Find the screen file: a path (with or without extension), or a bare id resolved against the
- *  design folder's screens/ (`lecodes render login`, honoring --dir). */
-const findScreenFile = (root: string, file: string, dirFlag: string | undefined): string => {
-  const candidates = [resolve(process.cwd(), file)]
-  if (!hasSeparator(file)) {
-    candidates.push(join(root, (dirFlag ?? DEFAULT_DESIGN_DIR).replace(/[/\\]+$/, ""), "screens", file))
-  }
-  for (const base of candidates) {
-    if (existsSync(base) && statSync(base).isFile()) return base
-    for (const ext of SCREEN_EXTS) if (existsSync(base + ext)) return base + ext
-  }
-  throw new CliError(
-    `No screen file at "${file}".` +
-    (hasSeparator(file) ? "" : ` Pass a path, or a screen id that exists in ${dirFlag ?? DEFAULT_DESIGN_DIR}/screens/.`))
-}
-
-/** The design folder a screen file belongs to ("<root>/design" for "/design/screens/login.ts"),
- *  or null when it isn't laid out as a design screen. */
-const designDirOf = (root: string, key: string): { dir: string, id: string } | null => {
-  const m = /^\/(.*)screens\/([^/]+)\.[^./]+$/.exec(key)
-  if (!m) return null
-  const dir = join(root, m[1])
-  return existsSync(join(dir, "meta.json")) ? { dir, id: m[2] } : null
-}
-
-/**
- * Resolve `<file>` into the virtual entry that opens its default export.
- * `state` picks the branch of a `(state) => UIScreen` screen (ignored by a value export).
- */
-const resolveScreenTarget = (
-  root: string, file: string, opts: { state?: string, dir?: string } = {},
-): ScreenTarget => {
-  const abs = findScreenFile(root, file, opts.dir)
-  const rel = relative(root, abs)
-  if (rel.startsWith("..") || isAbsolute(rel)) {
-    throw new CliError(
-      `"${file}" is outside the project (${root}) — a screen renders as part of its project, so its ` +
-      `imports and asset() files resolve from the same tree.`)
-  }
-  const key = toKey(rel)
-
-  // A file with no default export compiles to an empty render; say so here instead.
-  if (!/^\s*export\s+default\b/m.test(readFileSync(abs, "utf8"))) {
-    throw new CliError(
-      `${key.slice(1)} has no default export. A screen file ends with ` +
-      `\`export default UIScreen([...])\` — or \`export default (state) => UIScreen([...])\` for screen states.`)
-  }
-
-  // Same wrapper the design board compiles (designCompile.ts): a function export is invoked with the
-  // chosen state (a bare call uses the parameter's default = the canonical state), a value is used
-  // as-is, and either way the screen is opened so the runtime has something to render.
-  const invoke = opts.state !== undefined ? `screen(${JSON.stringify(opts.state)})` : "screen()"
-  const spec = "." + key.replace(/\.[^./]+$/, "")
-  const design = designDirOf(root, key)
-  return {
-    entryPath: SCREEN_ENTRY_PATH,
-    entry: {
-      path: SCREEN_ENTRY_PATH,
-      type: "text",
-      text: `import screen from ${JSON.stringify(spec)}\n`
-        + `const __screen = typeof screen === "function" ? ${invoke} : screen\n`
-        + `__screen.open()\n`,
-    },
-    frame: design ? screenFrame(design.dir, design.id) : undefined,
-    label: (design ? design.id : key.slice(1)) + (opts.state !== undefined ? `@${opts.state}` : ""),
-  }
-}
-
-/** The screen target named on the command line (`render <file>`), or undefined when no screen was
- *  named. Rejects the flag combinations that would fight over the entrypoint. */
-export type ScreenArgs = { file?: string, state?: string, entry?: string, dir?: string }
-export const screenTargetFrom = (root: string, a: ScreenArgs): ScreenTarget | undefined => {
-  if (a.file === undefined) {
-    if (a.state !== undefined) throw new CliError("--state picks a screen's state — name the screen file too: lecodes render <file> --state <name>")
-    return undefined
-  }
-  if (a.entry !== undefined) throw new CliError("Use either a screen file or --entry, not both — each names the module to compile from.")
-  return resolveScreenTarget(root, a.file, { state: a.state, dir: a.dir })
-}
+import { existsSync, readFileSync, statSync } from "node:fs"
+import { isAbsolute, join, relative, resolve } from "node:path"
+import { screenFrame } from "../project/designMeta"
+import { CliError } from "../cli"
+import { toKey } from "../project/paths"
+import type { CompileEntry } from "./projectCompile"
+
+/*
+ * Rendering ONE screen module instead of the whole app — `lecodes render <file>` (and
+ * `--desktop`). A design screen (`design/screens/login.ts`) never boots itself: it default-exports
+ * a `UIScreen`, or a `(state) => UIScreen` function for its states, and the design board / snapshot
+ * supply the `.open()`. This builds the same virtual entry for the normal project pipeline, so any
+ * file written that way — inside design/ or not — renders with the full `lecodes render` flag set
+ * (--png/--clip/--script/--device/…) against the project's real imports and assets.
+ *
+ * Kept in step with compile/designCompile.ts, which does the same wrapping per screen for the board.
+ */
+
+/** Extensions a screen module may carry (so `render design/screens/login` works too). */
+const SCREEN_EXTS = [".ts", ".tsx", ".js", ".jsx", ".mjs"]
+
+/** Where the generated entry lives — the project root, so its import specifier is the screen's
+ *  own project key ("./design/screens/login"). Leading dot: never a real project file. */
+const SCREEN_ENTRY_PATH = "/.screen-entry.ts"
+
+/** The design folder a bare screen id (`lecodes render login`) is looked up in. */
+const DEFAULT_DESIGN_DIR = "design"
+
+export type ScreenTarget = {
+  /** The virtual entry module — hand it to the compiler alongside the project's own entries. */
+  entry: CompileEntry
+  /** Path of that entry, for `entryOverride`. */
+  entryPath: string
+  /** The board frame from the design folder's meta.json, when this IS a design screen. */
+  frame?: [number, number]
+  /** How the screen is named in progress notes ("design/screens/login.ts", "login@empty"). */
+  label: string
+}
+
+/** `lecodes render <file|screen-id>` — the positional a screen render is asked for by. */
+
+/** Whether the argument names a path at all (vs a bare screen id). */
+const hasSeparator = (file: string) => file.includes("/") || file.includes("\\")
+
+/** Find the screen file: a path (with or without extension), or a bare id resolved against the
+ *  design folder's screens/ (`lecodes render login`, honoring --dir). */
+const findScreenFile = (root: string, file: string, dirFlag: string | undefined): string => {
+  const candidates = [resolve(process.cwd(), file)]
+  if (!hasSeparator(file)) {
+    candidates.push(join(root, (dirFlag ?? DEFAULT_DESIGN_DIR).replace(/[/\\]+$/, ""), "screens", file))
+  }
+  for (const base of candidates) {
+    if (existsSync(base) && statSync(base).isFile()) return base
+    for (const ext of SCREEN_EXTS) if (existsSync(base + ext)) return base + ext
+  }
+  throw new CliError(
+    `No screen file at "${file}".` +
+    (hasSeparator(file) ? "" : ` Pass a path, or a screen id that exists in ${dirFlag ?? DEFAULT_DESIGN_DIR}/screens/.`))
+}
+
+/** The design folder a screen file belongs to ("<root>/design" for "/design/screens/login.ts"),
+ *  or null when it isn't laid out as a design screen. */
+const designDirOf = (root: string, key: string): { dir: string, id: string } | null => {
+  const m = /^\/(.*)screens\/([^/]+)\.[^./]+$/.exec(key)
+  if (!m) return null
+  const dir = join(root, m[1])
+  return existsSync(join(dir, "meta.json")) ? { dir, id: m[2] } : null
+}
+
+/**
+ * Resolve `<file>` into the virtual entry that opens its default export.
+ * `state` picks the branch of a `(state) => UIScreen` screen (ignored by a value export).
+ */
+const resolveScreenTarget = (
+  root: string, file: string, opts: { state?: string, dir?: string } = {},
+): ScreenTarget => {
+  const abs = findScreenFile(root, file, opts.dir)
+  const rel = relative(root, abs)
+  if (rel.startsWith("..") || isAbsolute(rel)) {
+    throw new CliError(
+      `"${file}" is outside the project (${root}) — a screen renders as part of its project, so its ` +
+      `imports and asset() files resolve from the same tree.`)
+  }
+  const key = toKey(rel)
+
+  // A file with no default export compiles to an empty render; say so here instead.
+  if (!/^\s*export\s+default\b/m.test(readFileSync(abs, "utf8"))) {
+    throw new CliError(
+      `${key.slice(1)} has no default export. A screen file ends with ` +
+      `\`export default UIScreen([...])\` — or \`export default (state) => UIScreen([...])\` for screen states.`)
+  }
+
+  // Same wrapper the design board compiles (designCompile.ts): a function export is invoked with the
+  // chosen state (a bare call uses the parameter's default = the canonical state), a value is used
+  // as-is, and either way the screen is opened so the runtime has something to render.
+  const invoke = opts.state !== undefined ? `screen(${JSON.stringify(opts.state)})` : "screen()"
+  const spec = "." + key.replace(/\.[^./]+$/, "")
+  const design = designDirOf(root, key)
+  return {
+    entryPath: SCREEN_ENTRY_PATH,
+    entry: {
+      path: SCREEN_ENTRY_PATH,
+      type: "text",
+      text: `import screen from ${JSON.stringify(spec)}\n`
+        + `const __screen = typeof screen === "function" ? ${invoke} : screen\n`
+        + `__screen.open()\n`,
+    },
+    frame: design ? screenFrame(design.dir, design.id) : undefined,
+    label: (design ? design.id : key.slice(1)) + (opts.state !== undefined ? `@${opts.state}` : ""),
+  }
+}
+
+/** The screen target named on the command line (`render <file>`), or undefined when no screen was
+ *  named. Rejects the flag combinations that would fight over the entrypoint. */
+export type ScreenArgs = { file?: string, state?: string, entry?: string, dir?: string }
+export const screenTargetFrom = (root: string, a: ScreenArgs): ScreenTarget | undefined => {
+  if (a.file === undefined) {
+    if (a.state !== undefined) throw new CliError("--state picks a screen's state — name the screen file too: lecodes render <file> --state <name>")
+    return undefined
+  }
+  if (a.entry !== undefined) throw new CliError("Use either a screen file or --entry, not both — each names the module to compile from.")
+  return resolveScreenTarget(root, a.file, { state: a.state, dir: a.dir })
+}

package/src/dev/devServer.ts

@@ -1,4 +1,5 @@
-import { createReadStream, statSync } from "node:fs"
+import { createHash } from "node:crypto"
+import { createReadStream, readFileSync, statSync } from "node:fs"
 import { join } from "node:path"
 import { Readable } from "node:stream"
 import type { Manifest } from "../project/manifest"
@@ -14,6 +15,7 @@ import { toKey } from "../project/paths"
 import { makeStackDemangler } from "../compile/nativeStack"
 import type { WebRunner } from "./webRunner"
 import { createProjectBackend } from "./projectBackend"
+import { buildHalf, halfModule, projectHalves, type ProjectHalf } from "../web/halves"
 
 /*
  * The `lecodes dev` LAN server: serves the project to devices and hot-reloads it on change. It
@@ -35,7 +37,12 @@ import { createProjectBackend } from "./projectBackend"
  *                                the native prelude; the player owns reload (ws / version
  *                                polling) and the log backchannel. A phone is sent here at once
  *   GET /t/<tok>/lite/[file]     the page of Web Lite (lecodes-web-lite's dist), opened as
- *                                lite/?dev=.. — the same bundle.js?t=web, the same reload and logs
+ *                                lite/?dev=.. — the same bundle.js?t=web, the same reload and logs;
+ *                                the project's own web halves (web/halves.ts) under it as a build
+ *                                has them — lite/plugins/<folder>/index.js (built with each
+ *                                compile), its `web.static` folder from the project, and
+ *                                lite/plugins.json naming them for their ids (before the
+ *                                first-party half of the id: its fallback)
  *   POST /t/<tok>/server/api/<id>  the project's backend (its `*.server.ts` files, run on this
  *   WS   /t/<tok>/server/ws        machine — projectBackend.ts): the wire of sdk/src/runtime/rpc.ts,
  *                                the one the runner serves on le.codes
@@ -63,8 +70,12 @@ export type DevServerOptions = {
   /** What is served under /web/ (src/dev/webRunner.ts): the player, and the page around it; absent =
    *  no browser route. */
   web?: WebRunner | null
-  /** The page of Web Lite (lecodes-web-lite's dist), served under /lite/; absent = no such route. */
+  /** The page of Web Lite (lecodes-web-lite's dist), served under /lite/; absent = no such route.
+   *  With it, every compile builds the project's own web halves too (web/halves.ts). */
   lite?: string | null
+  /** Serve over https with this certificate (`lecodes web dev --https`, dev/https.ts); `origin`
+   *  says https then. */
+  tls?: { cert: string, key: string }
   /** Diagnostics (compile errors, device logs); defaults to stderr-style silence-safe noop. */
   log?: (msg: string) => void
   /** The folder of the backend's database (default `.lecodes/db`; the browser tests keep their own). */
@@ -189,9 +200,12 @@ export const startDevServer = async (options: DevServerOptions): Promise<DevServ
       const onWarning = (w: string) => { warnings.push(w) }
       const serverBundle = await backend.compile(entries)
       const js = await compileProject({ entries, name, publicUrl: origin, entryOverride, header: true, fontsHeader, iconsHeader, onWarning, serverUrl: serverBundle ? serverUrl : undefined })
+      // the page's own halves, before anything is told to reload: one that does not build fails the
+      // compile, the page keeps the last good ones
+      const halvesChanged = lite ? await buildHalves() : false
       // the backend takes the new bundle once the app compiled, and before devices are told to reload
       warnings.push(...await backend.run(serverBundle))
-      const changed = bundleJs === null || stripVolatile(js) !== stripVolatile(bundleJs)
+      const changed = bundleJs === null || stripVolatile(js) !== stripVolatile(bundleJs) || halvesChanged
       if (changed) {
         bundleJs = js
         v++
@@ -203,6 +217,36 @@ export const startDevServer = async (options: DevServerOptions): Promise<DevServ
     }
   }
 
+  // ---- the project's own web halves (web/halves.ts), for the page of Web Lite -----------------------
+  // Built with every compile; plugins.json names each by its hash (`index.js?h=…`), so a page that
+  // imported a half sees it changed and loads again (a half is imported once per document).
+  let halves: { half: ProjectHalf, js: string, hash: string }[] = []
+  const buildHalves = async (): Promise<boolean> => {
+    const next: typeof halves = []
+    for (const half of projectHalves(root)) {
+      const js = await buildHalf(half, { dev: true })
+      next.push({ half, js, hash: createHash("sha256").update(js).digest("hex").slice(0, 10) })
+    }
+    const key = (list: typeof halves) => list.map((h) => `${h.half.id}=${h.half.folder}@${h.hash}`).join(";")
+    const changed = key(next) !== key(halves)
+    halves = next
+    return changed
+  }
+  /** The page's plugins.json: Web Lite's first-party halves, the project's BEFORE theirs — a
+   *  project's half of an id is tried first, the first-party one takes the page where it declines
+   *  (`"ar": ["plugins/ar-8thwall/index.js?h=…", "plugins/ar/index-….js"]`, as `web build` writes). */
+  const liteTable = (): Record<string, string | string[]> => {
+    let plugins: Record<string, string> = {}
+    try { plugins = (JSON.parse(readFileSync(join(lite!, "plugins.json"), "utf8")) as { plugins?: Record<string, string> }).plugins ?? {} } catch { /* a page without plugins */ }
+    const table: Record<string, string | string[]> = { ...plugins }
+    for (const { half, hash } of halves) {
+      const own = `${halfModule(half)}?h=${hash}`
+      const firstParty = plugins[half.id]
+      table[half.id] = firstParty !== undefined ? [own, firstParty] : own
+    }
+    return table
+  }
+
   // ---- the project's backend (projectBackend.ts), started with the first compile that has server files
   const backend = createProjectBackend({ root, log, dbDir: options.dbDir, command: "lecodes dev" })
   /** What the app's stubs call. Baked with the advertised origin; a bundle is served with the origin
@@ -259,9 +303,11 @@ export const startDevServer = async (options: DevServerOptions): Promise<DevServ
     const transport = transportOf(url)
     return transport === "web" ? js : js + "\n" + renderPrelude({ origin: reqOrigin, base, transport, v })
   }
-  // The backend's url likewise: the app calls it through the origin the bundle was fetched from.
+  // Every url of this server the bundle names likewise — its assets, its shaders, the backend: the
+  // app reaches them through the origin the bundle was fetched from. (`web dev` advertises
+  // localhost; a phone that opened the page by the LAN address would otherwise ask ITSELF.)
   const rebased = (js: string, reqOrigin: string) =>
-    reqOrigin === origin ? js : js.split(serverUrl).join(`${reqOrigin}${base}/server`)
+    reqOrigin === origin ? js : js.split(`${origin}${base}/`).join(`${reqOrigin}${base}/`)
   const web = options.web ?? null
   const lite = options.lite ?? null
   /** A file of a built folder; the entry files revalidate — a CLI update swaps them under the same
@@ -280,7 +326,7 @@ export const startDevServer = async (options: DevServerOptions): Promise<DevServ
 
   const handle = async (req: Request, ip: string | undefined): Promise<Response> => {
     const host = req.headers.get("host")
-    const reqOrigin = host ? `http://${host}` : origin
+    const reqOrigin = host ? `${options.tls ? "https" : "http"}://${host}` : origin
     const url = new URL(req.url)
     const path = url.pathname
     // Browsers ask for it on every page load (the /web/ runner) — keep the console clean.
@@ -317,6 +363,15 @@ export const startDevServer = async (options: DevServerOptions): Promise<DevServ
         url.searchParams.set("dev", "..")
         return redirect(`${base}/lite/?${url.searchParams.toString()}${url.hash}`)
       }
+      if (rel === "/plugins.json") return json(200, { plugins: liteTable() })
+      const own = halves.find(({ half }) => rel.startsWith(`/plugins/${half.folder}/`))
+      if (own) {
+        const sub = rel.slice(`/plugins/${own.half.folder}/`.length)
+        if (sub === "index.js") return text(200, "text/javascript", own.js)
+        const folder = own.half.static
+        if (folder && sub.startsWith(`${folder}/`)) return built(own.half.dir, sub)
+        return text(404, "text/plain", "Not found")
+      }
       return built(lite, rel === "/" ? "index.html" : rel.slice(1))
     }
     if (route === "/version") {
@@ -372,6 +427,7 @@ export const startDevServer = async (options: DevServerOptions): Promise<DevServ
   const server = await serve({
     port: options.port,
     hostname: options.bind,
+    tls: options.tls,
     fetch: (req, peer) => handle(req, peer.ip),
     websocket: (req, peer) => {
       const path = new URL(req.url).pathname

package/src/dev/https.ts

@@ -0,0 +1,50 @@
+import { existsSync, mkdirSync, readFileSync, writeFileSync } from "node:fs"
+import { homedir } from "node:os"
+import { join } from "node:path"
+
+/*
+ * The certificate of `lecodes web dev --https`. A phone's camera and motion sensors are given to a
+ * SECURE page only, and on the LAN that is an https one: a self-signed certificate, made once and
+ * kept in ~/.lecodes/dev-https/ — for every address it was asked for (localhost, the machine's LAN
+ * addresses), made again when one is new or when it is old. No authority signed it: the browser
+ * warns, the person accepts it once per device.
+ */
+
+const DIR = () => join(homedir(), ".lecodes", "dev-https")
+/** Days a certificate is valid: under the 398 a phone's browser accepts for a server's. */
+const DAYS = 397
+/** Made again after this many: before it runs out. */
+const RENEW_DAYS = 300
+
+type Kept = { names: string[], made: number }
+
+/** The certificate for `names` (+ localhost); `dir` is where it is kept (a test's own). */
+export const devCertificate = async (names: string[], dir = DIR()): Promise<{ cert: string, key: string }> => {
+  const files = { cert: join(dir, "cert.pem"), key: join(dir, "key.pem"), meta: join(dir, "names.json") }
+  let kept: Kept | null = null
+  try { kept = JSON.parse(readFileSync(files.meta, "utf8")) as Kept } catch { /* none yet */ }
+  const wanted = [...new Set(["localhost", "127.0.0.1", ...names])]
+  const fresh = kept && Date.now() - kept.made < RENEW_DAYS * 86_400_000 && wanted.every((n) => kept!.names.includes(n))
+  if (fresh && existsSync(files.cert) && existsSync(files.key)) {
+    return { cert: readFileSync(files.cert, "utf8"), key: readFileSync(files.key, "utf8") }
+  }
+  // (only here: the one command that asks for it loads it)
+  const { generate } = await import("selfsigned")
+  const all = [...new Set([...(kept?.names ?? []), ...wanted])]
+  const ip = /^\d{1,3}(\.\d{1,3}){3}$/
+  const made = generate([{ name: "commonName", value: "LeCodes dev" }, { name: "organizationName", value: "LeCodes dev server" }], {
+    days: DAYS, keySize: 2048, algorithm: "sha256",
+    extensions: [
+      { name: "basicConstraints", cA: false },
+      { name: "keyUsage", digitalSignature: true, keyEncipherment: true },
+      { name: "extKeyUsage", serverAuth: true },
+      // altName types of X.509: 2 = a DNS name, 7 = an IP address
+      { name: "subjectAltName", altNames: all.map((n) => (ip.test(n) ? { type: 7, ip: n } : { type: 2, value: n })) },
+    ],
+  })
+  mkdirSync(dir, { recursive: true })
+  writeFileSync(files.cert, made.cert)
+  writeFileSync(files.key, made.private)
+  writeFileSync(files.meta, JSON.stringify({ names: all, made: Date.now() } satisfies Kept))
+  return { cert: made.cert, key: made.private }
+}

package/src/dev/serve.ts

@@ -1,5 +1,6 @@
-import { createServer, type IncomingMessage } from "node:http"
-import { Readable } from "node:stream"
+import { createServer, type IncomingMessage, type ServerResponse } from "node:http"
+import { createServer as createHttpsServer } from "node:https"
+import { Readable, type Duplex } from "node:stream"
 import { upgradeWebSocket } from "./wsServer"
 
 /*
@@ -35,6 +36,8 @@ export type ServeOptions = {
   port: number
   /** Bind address (default 0.0.0.0). */
   hostname?: string
+  /** https (and wss) with this certificate and key, PEM. */
+  tls?: { cert: string, key: string }
   fetch: (req: Request, peer: Peer) => Response | Promise<Response>
   /** A websocket asks to connect: return what takes the open socket, or null to refuse. Decided
    *  from the request alone (its path), before the handshake. */
@@ -64,6 +67,7 @@ const serveBun = (opts: ServeOptions): Served => {
     server = Bun.serve<BunSocketData>({
       port: opts.port,
       hostname: opts.hostname ?? "0.0.0.0",
+      ...(opts.tls ? { tls: { cert: opts.tls.cert, key: opts.tls.key } } : {}),
       // seconds, the most Bun takes: an endpoint of a project's backend may think for 30
       idleTimeout: 255,
       async fetch(req, srv) {
@@ -110,33 +114,35 @@ const serveBun = (opts: ServeOptions): Served => {
 
 // ───────────────────────────── Node ─────────────────────────────
 
-const requestOf = (req: IncomingMessage, upgrade = false): Request => {
+const requestOf = (req: IncomingMessage, upgrade = false, scheme = "http"): Request => {
   const headers = new Headers()
   for (const [k, v] of Object.entries(req.headers)) {
     if (v !== undefined) headers.set(k, Array.isArray(v) ? v.join(", ") : v)
   }
   const method = req.method ?? "GET"
   const bodyless = upgrade || method === "GET" || method === "HEAD"
-  return new Request(new URL(req.url ?? "/", `http://${req.headers.host ?? "localhost"}`).href, {
+  return new Request(new URL(req.url ?? "/", `${scheme}://${req.headers.host ?? "localhost"}`).href, {
     method, headers,
     ...(bodyless ? {} : { body: Readable.toWeb(req), duplex: "half" }),
   } as unknown as RequestInit)
 }
 
 const serveNode = async (opts: ServeOptions): Promise<Served> => {
-  const server = createServer((req, res) => {
+  const scheme = opts.tls ? "https" : "http"
+  const onRequest = (req: IncomingMessage, res: ServerResponse) => {
     void (async () => {
       let response: Response
-      try { response = await opts.fetch(requestOf(req), { ip: req.socket.remoteAddress }) }
+      try { response = await opts.fetch(requestOf(req, false, scheme), { ip: req.socket.remoteAddress }) }
       catch (e) { response = failure(opts, e) }
       res.writeHead(response.status, Object.fromEntries(response.headers))
       if (!response.body || req.method === "HEAD") { res.end(); return }
       Readable.fromWeb(response.body as unknown as import("node:stream/web").ReadableStream).on("error", () => res.destroy()).pipe(res)
     })()
-  })
-  server.on("upgrade", (req, socket) => {
+  }
+  const server = opts.tls ? createHttpsServer({ cert: opts.tls.cert, key: opts.tls.key }, onRequest) : createServer(onRequest)
+  server.on("upgrade", (req: IncomingMessage, socket: Duplex) => {
     let accept: ((socket: Socket) => SocketHandlers) | null = null
-    try { accept = opts.websocket?.(requestOf(req, true), { ip: req.socket.remoteAddress }) ?? null }
+    try { accept = opts.websocket?.(requestOf(req, true, scheme), { ip: req.socket.remoteAddress }) ?? null }
     catch (e) { opts.onError?.(e) }
     if (!accept) { socket.destroy(); return }
     let handlers: SocketHandlers | null = null

package/src/dev/webRunner.ts

@@ -34,6 +34,8 @@ type Built = {
   sources: string[]
   /** The arguments of the `vite build` that makes it. */
   build: string[]
+  /** A command run after it in the package (a build step outside vite), when there is one. */
+  after?: string[]
 }
 
 const PLAYER: Built = {
@@ -47,10 +49,11 @@ const PAGE: Built = {
 }
 
 // Web Lite (lecodes-web-lite's dist): the app as a web page, DOM and CSS — what `lecodes web`
-// serves and builds from.
+// serves and builds from. Its plugins' halves are a step of their own after the vite build (which
+// empties dist/): build/plugins.ts writes dist/plugins/ and plugins.json from the plugin repo.
 const LITE: Built = {
-  pkg: "lecodes-web-lite", dist: "dist", entry: "lite.js", vendored: "web-lite", build: [],
-  sources: ["hosts/web-lite/src", "hosts/web-lite/index.html", "renderers/web-lite/src", "renderers/web-shared/src", "hosts/web-player/src/dev.ts", "engines/gl-lite/src"],
+  pkg: "lecodes-web-lite", dist: "dist", entry: "lite.js", vendored: "web-lite", build: [], after: ["bun", "build/plugins.ts"],
+  sources: ["hosts/web-lite/src", "hosts/web-lite/index.html", "hosts/web-lite/build", "renderers/web-lite/src", "renderers/web-shared/src", "hosts/web-player/src/dev.ts", "engines/gl-lite/src", "hosts/plugins/plugins"],
 }
 
 /** The built page of Web Lite, or null when this CLI has none. */
@@ -71,6 +74,11 @@ const resolve = (built: Built, log: (message: string) => void): string | null =>
       log(`Building ${built.pkg} (its sources are newer than its build)…`)
       const done = spawnSync("bunx", ["vite", "build", ...built.build], { cwd: checkout, stdio: "pipe", encoding: "utf8", shell: process.platform === "win32" })
       if (done.status !== 0) log(`${built.pkg} did not build — the browser gets the build that is there:\n${done.stderr || done.stdout}`)
+      else if (built.after) {
+        const [command, ...args] = built.after
+        const step = spawnSync(command!, args, { cwd: checkout, stdio: "pipe", encoding: "utf8", shell: process.platform === "win32" })
+        if (step.status !== 0) log(`${built.pkg}: \`${built.after.join(" ")}\` failed — its build is without that step:\n${step.stderr || step.stdout}`)
+      }
     }
     if (has(dist)) return dist
   }

package/src/platform/serverDiff.ts

@@ -1,9 +1,8 @@
 import { readFileSync } from "node:fs"
 import type { Project, ProjectAsset } from "./api"
 import type { LocalScan } from "../project/localFiles"
-import { classifyKind, isTextKind } from "../project/localFiles"
+import { isTextKind } from "../project/localFiles"
 import { buildPaths } from "../project/materialize"
-import { basename } from "node:path"
 
 /*
  * Compares the local working tree against the project's current server state — the basis for
@@ -49,7 +48,7 @@ export const computeServerDiff = (project: Project, scan: LocalScan): ServerDiff
     const local = localByPath.get(path)
 
     if (local && !server) {
-      const text = isTextKind(classifyKind(basename(path)))
+      const text = isTextKind(local.kind)
       entries.push({ path, status: "added", binary: !text, serverText: "", localText: text ? readFileSync(local.absPath, "utf8") : undefined })
       continue
     }

package/src/plugin/emitPackage.ts

@@ -1,7 +1,8 @@
 // A plugin repo's `Package.swift`, from the manifests: the plugins with an iOS half as ONE SwiftPM
-// package — a target per plugin (its sources `plugins/<id>/ios`, the packages its manifest names)
-// and a product per plugin. Each plugin is its own MODULE, so two plugins may declare a type of the
-// same name, and an Xcode project links a plugin as a product instead of compiling its folder.
+// package — a target per plugin (its sources `plugins/<id>/ios`, the packages its manifest names,
+// a binary target per prebuilt xcframework of `ios.binaries`, by its path in the repo) and a product
+// per plugin. Each plugin is its own MODULE, so two plugins may declare a type of the same name, and
+// an Xcode project links a plugin as a product instead of compiling its folder.
 //
 // The targets depend on the LeCodes SDK as a package on disk: `LECODES_IOS_SDK_PATH`, else the path
 // the repo's package.json names (`lecodes.iosSdkPath`), else the sibling `../lecodes` (a checkout
@@ -11,7 +12,7 @@
 // of its own (templates/ios.ts), pinned by plugins.lock.json.
 
 import type { PluginManifest } from "./manifest"
-import { pascal } from "./manifest"
+import { binaryName, pascal } from "./manifest"
 
 export class PackageError extends Error {}
 
@@ -30,7 +31,8 @@ export const DEFAULT_SDK_PATH = "../lecodes"
 
 /** The text of the repo's Package.swift for `plugins` (every manifest; those without an iOS half are
  *  left out); `sdkPath` is the repo's own SDK location (package.json `lecodes.iosSdkPath`). Throws
- *  PackageError when two plugins pin one package at different versions. */
+ *  PackageError when two plugins pin one package at different versions, or when a binary's name is
+ *  another target's (one name, one target of the package). */
 export const emitPackageSwift = (plugins: { id: string, manifest: PluginManifest }[], sdkPath: string = DEFAULT_SDK_PATH): string => {
   const ios = plugins.filter(p => p.manifest.ios !== null)
   const packages = new Map<string, { url: string, exact?: string, from?: string, by: string }>()
@@ -44,6 +46,14 @@ export const emitPackageSwift = (plugins: { id: string, manifest: PluginManifest
     }
   }
   const moduleOf = (p: { id: string, manifest: PluginManifest }) => iosModule(p.id, p.manifest)
+  const targetNames = new Map<string, string>(ios.map(p => [moduleOf(p), `the module of "${p.id}"`]))
+  for (const p of ios) {
+    for (const path of p.manifest.ios!.binaries ?? []) {
+      const prior = targetNames.get(binaryName(path))
+      if (prior) throw new PackageError(`"${p.id}" carries the binary ${binaryName(path)} and ${binaryName(path)} is ${prior} — one name is one target of the package`)
+      targetNames.set(binaryName(path), `a binary of "${p.id}"`)
+    }
+  }
 
   const products = ios.map(p => `        .library(name: "${moduleOf(p)}", targets: ["${moduleOf(p)}"]),`)
   const dependencies = [
@@ -51,9 +61,11 @@ export const emitPackageSwift = (plugins: { id: string, manifest: PluginManifest
     ...[...packages.values()].map(pkg => `        .package(url: "${pkg.url}", ${pkg.exact ? `exact: "${pkg.exact}"` : `from: "${pkg.from}"`}),`),
   ]
   const targets = ios.map(p => {
+    const binaries = p.manifest.ios!.binaries ?? []
     const deps = [
       `.product(name: "LeCodes", package: "lecodes")`,
       ...(p.manifest.ios!.packages ?? []).flatMap(pkg => pkg.products.map(name => `.product(name: "${name}", package: "${swiftPackageName(pkg.url)}")`)),
+      ...binaries.map(path => `"${binaryName(path)}"`),
     ]
     return [
       `        // ${p.id}`,
@@ -62,6 +74,7 @@ export const emitPackageSwift = (plugins: { id: string, manifest: PluginManifest
       `            dependencies: [${deps.join(", ")}],`,
       `            path: "plugins/${p.id}/ios"`,
       `        ),`,
+      ...binaries.map(path => `        .binaryTarget(name: "${binaryName(path)}", path: "plugins/${p.id}/${path.split(/[\\/]/).join("/")}"),`),
     ].join("\n")
   })