frontend: nest asset output under dist/static/

The src/index.html / src/stats.html files reference assets at URLs
like /static/app.js, /static/dashboard.css. The initial Phase 1 build
flattened everything to dist/{app.js, dashboard.css, ...} which would
have forced the Phase 4 Rust ServeDir mount to do URL rewriting just
to make the existing HTML references resolve.

Rework: bundles now write to dist/static/, HTML stays at dist/ top
level. Layout matches the URLs the HTML uses, so the Phase 4 mount
is the simplest possible `fallback_service(ServeDir::new(dist))`.

No source-file changes — just the esbuild outfile/outdir paths.
Rebuilt; verified asset filenames + sizes unchanged.

Refs #273.
This commit is contained in:
iris 2026-05-23 13:11:41 +02:00 committed by Mara
parent 892e034908
commit 2ecf15bb6f
2 changed files with 34 additions and 31 deletions

View file

@ -1,18 +1,21 @@
// esbuild build for @hive/agent. Outputs: // esbuild build for @hive/agent. Output layout (`dist/`):
// //
// dist/app.js bundled ES module (entrypoint = src/app.js, // dist/index.html served at GET /
// dist/stats.html served at GET /stats
// dist/screen.html served at GET /screen
// dist/static/app.js served at /static/app.js (ESM bundle,
// pulls in @hive/shared + marked) // pulls in @hive/shared + marked)
// dist/agent.css bundled stylesheet (entrypoint = src/agent.css, // dist/static/app.js.map source map sibling
// @import "@hive/shared/base.css" + terminal.css // dist/static/stats.js served at /static/stats.js (pulls in
// get inlined here) // chart.js/auto)
// dist/stats.js bundled stats page (entrypoint = src/stats.js, // dist/static/stats.js.map source map sibling
// pulls in chart.js/auto) // dist/static/agent.css served at /static/agent.css (@import
// dist/{index,stats,screen}.html copies of src/*.html (esbuild // resolved from @hive/shared)
// doesn't process HTML; the bundled siblings are
// referenced by name)
// //
// The in-container Rust binary serves `dist/` via tower_http::ServeDir, // The in-container Rust binary mounts `dist/` (with per-agent
// with the per-agent `hyperhive.frontend.extraFiles` layered on top. // `hyperhive.frontend.extraFiles` layered on top) as a
// `tower_http::ServeDir` fallback; the layout above keeps every URL
// the HTML references reachable without rewriting paths.
import { build } from 'esbuild'; import { build } from 'esbuild';
import { mkdirSync, copyFileSync, rmSync } from 'node:fs'; import { mkdirSync, copyFileSync, rmSync } from 'node:fs';
@ -22,15 +25,16 @@ import { fileURLToPath } from 'node:url';
const here = dirname(fileURLToPath(import.meta.url)); const here = dirname(fileURLToPath(import.meta.url));
const src = (p) => resolve(here, 'src', p); const src = (p) => resolve(here, 'src', p);
const dist = (p) => resolve(here, 'dist', p); const dist = (p) => resolve(here, 'dist', p);
const staticDir = (p) => resolve(here, 'dist', 'static', p);
rmSync(dist(''), { recursive: true, force: true }); rmSync(dist(''), { recursive: true, force: true });
mkdirSync(dist(''), { recursive: true }); mkdirSync(staticDir(''), { recursive: true });
// Two JS entries: the main app + the stats page. Both bundle their // Two JS entries: the main app + the stats page. Both bundle their
// own deps so each page can be loaded independently. // own deps so each page can be loaded independently.
await build({ await build({
entryPoints: [src('app.js'), src('stats.js')], entryPoints: [src('app.js'), src('stats.js')],
outdir: dist(''), outdir: staticDir(''),
bundle: true, bundle: true,
format: 'esm', format: 'esm',
platform: 'browser', platform: 'browser',
@ -43,7 +47,7 @@ await build({
// shared/terminal.css from the @hive/shared workspace dep. // shared/terminal.css from the @hive/shared workspace dep.
await build({ await build({
entryPoints: [src('agent.css')], entryPoints: [src('agent.css')],
outfile: dist('agent.css'), outfile: staticDir('agent.css'),
bundle: true, bundle: true,
loader: { '.css': 'css' }, loader: { '.css': 'css' },
logLevel: 'info', logLevel: 'info',

View file

@ -1,17 +1,15 @@
// esbuild build for @hive/dashboard. Outputs: // esbuild build for @hive/dashboard. Output layout (`dist/`):
// //
// dist/app.js bundled ES module (entrypoint = src/app.js, // dist/index.html served by the Rust router at GET /
// dist/static/app.js served at /static/app.js (ESM bundle,
// pulls in @hive/shared + marked) // pulls in @hive/shared + marked)
// dist/dashboard.css bundled stylesheet (entrypoint = src/dashboard.css, // dist/static/app.js.map source map sibling
// @import "@hive/shared/base.css" + terminal.css // dist/static/dashboard.css served at /static/dashboard.css
// get inlined here) // (@import resolved from @hive/shared)
// dist/index.html copy of src/index.html (esbuild doesn't process
// HTML; the script/link tags reference the bundled
// siblings by name)
// //
// Both Rust binaries serve `dist/` via tower_http::ServeDir. The output // The Rust binary mounts `dist/` as a `tower_http::ServeDir` fallback;
// must keep the same filenames the existing index.html references, so // the layout above keeps every URL the index.html references reachable
// downstream changes are mechanical. // without rewriting paths in the HTML.
import { build } from 'esbuild'; import { build } from 'esbuild';
import { mkdirSync, copyFileSync, rmSync } from 'node:fs'; import { mkdirSync, copyFileSync, rmSync } from 'node:fs';
@ -21,16 +19,17 @@ import { fileURLToPath } from 'node:url';
const here = dirname(fileURLToPath(import.meta.url)); const here = dirname(fileURLToPath(import.meta.url));
const src = (p) => resolve(here, 'src', p); const src = (p) => resolve(here, 'src', p);
const dist = (p) => resolve(here, 'dist', p); const dist = (p) => resolve(here, 'dist', p);
const staticDir = (p) => resolve(here, 'dist', 'static', p);
rmSync(dist(''), { recursive: true, force: true }); rmSync(dist(''), { recursive: true, force: true });
mkdirSync(dist(''), { recursive: true }); mkdirSync(staticDir(''), { recursive: true });
// Bundle the JS entry. ES-module output, browser target, no minify // Bundle the JS entry. ES-module output, browser target, no minify
// (line-aligned source aids debugging; minification belongs in a later // (line-aligned source aids debugging; minification belongs in a later
// follow-up once asset sizes warrant it). // follow-up once asset sizes warrant it).
await build({ await build({
entryPoints: [src('app.js')], entryPoints: [src('app.js')],
outfile: dist('app.js'), outfile: staticDir('app.js'),
bundle: true, bundle: true,
format: 'esm', format: 'esm',
platform: 'browser', platform: 'browser',
@ -43,7 +42,7 @@ await build({
// re-exports from @hive/shared. // re-exports from @hive/shared.
await build({ await build({
entryPoints: [src('dashboard.css')], entryPoints: [src('dashboard.css')],
outfile: dist('dashboard.css'), outfile: staticDir('dashboard.css'),
bundle: true, bundle: true,
loader: { '.css': 'css' }, loader: { '.css': 'css' },
logLevel: 'info', logLevel: 'info',