[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_239":240,"_241":242},"routes/_app.x.$handle.$name",{"_93":92,"_32":44,"_101":83,"_27":102,"_13":14,"_103":-5,"_11":104,"_105":106,"_107":108,"_109":110,"_111":112,"_20":-5,"_113":-5,"_114":-5,"_115":25,"_116":117,"_118":119,"_120":-5,"_121":-5,"_122":123},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_42":43,"_32":44,"_37":45,"_46":-5,"_47":25,"_48":49,"_50":49,"_51":52,"_53":-5,"_18":54,"_55":-5,"_56":25,"_57":-5,"_58":-5,"_59":60,"_61":62,"_63":-5,"_64":-5,"_65":-5,"_66":-5,"_67":68,"_69":68,"_70":71,"_72":71,"_73":71,"_74":68,"_75":68,"_76":77,"_78":79,"_80":81,"_82":25},"version",20,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":23,"_24":25,"_26":25,"_27":28,"_29":28},"file",{"_30":31,"_32":28,"_33":20,"_34":36,"_37":38,"_39":14,"_40":41,"_24":25},"previous",{"_30":31,"_32":28,"_33":20,"_34":35},"deleted",false,"deletedHere","path","README.md","latestPath","fileId","0e3bb6d4-2fd6-11f1-8c61-42dde27851f2","name","fileType","content","# vt-hono-server-static\n\nA Val Town adapter for Hono's `serveStatic` middleware. Lets you use the standard Hono `serveStatic` API — the same one used on Deno, Bun, Node, and Cloudflare Workers — to serve static files from your val's project files.\n\n## Why?\n\nHono's built-in `serveStatic` middleware requires filesystem access (`Deno.open`, `node:fs`, etc.), which Val Town doesn't provide. The existing `std/utils` provides `staticHTTPServer()` and `serveFile()`, but these don't integrate with Hono's middleware system.\n\nThis adapter bridges that gap — you get the full `serveStatic` API (`root`, `path`, `rewriteRequestPath`, `onFound`, `onNotFound`, `mimes`, etc.) working natively on Val Town.\n\n## Usage\n\n```ts\nimport { Hono } from \"npm:hono@4\";\nimport { serveStatic } from \"https://esm.town/v/nbbaier/vt-hono-server-static/main.ts\";\n\nconst app = new Hono();\n\n// Serve files under /static/* from the project root\napp.use(\"/static/*\", serveStatic({ root: \"./\" }));\n\n// Serve a specific file at a fixed path\napp.use(\"/favicon.ico\", serveStatic({ path: \"./favicon.ico\" }));\n\n// Rewrite request paths (e.g., /assets/* → /frontend/*)\napp.use(\"/assets/*\", serveStatic({\n root: \"./\",\n rewriteRequestPath: (path) => path.replace(/^\\/assets/, \"/frontend\"),\n}));\n\n// Callbacks for cache headers or debugging\napp.use(\"/static/*\", serveStatic({\n root: \"./\",\n onFound: (path, c) => {\n c.header(\"Cache-Control\", \"public, max-age=3600\");\n },\n onNotFound: (path, c) => {\n console.log(`${path} not found, requested ${c.req.path}`);\n },\n}));\n\napp.onError((err) => Promise.reject(err));\nexport default app.fetch;\n```\n\n## Options\n\nAll standard [Hono `ServeStaticOptions`](https://hono.dev/docs/getting-started/deno#serve-static-files) are supported:\n\n| Option | Type | Description |\n|---|---|---|\n| `root` | `string` | Root directory for file resolution (e.g., `\"./\"`, `\"./frontend\"`) |\n| `path` | `string` | Serve a specific file regardless of request path |\n| `rewriteRequestPath` | `(path: string) => string` | Transform the request path before file lookup |\n| `mimes` | `Record` | Additional MIME type mappings |\n| `onFound` | `(path: string, c: Context) => void` | Called when a file is found |\n| `onNotFound` | `(path: string, c: Context) => void` | Called when a file is not found |\n| `precompressed` | `boolean` | Check for `.br`/`.gz` variants (no-op on Val Town) |\n\nPlus one Val Town-specific option:\n\n| Option | Type | Description |\n|---|---|---|\n| `metaImportUrl` | `string` | Override `import.meta.url` for resolving files from a different val |\n\n## How It Works\n\n```mermaid\ngraph LR\n A[Hono Request] --> B[serveStatic middleware]\n B --> C[baseServeStatic
hono/serve-static]\n C --> D{getContent}\n D -->|.ts/.tsx/.jsx| E[readFileTranspiled
std/utils]\n D -->|other files| F[readFile
std/utils]\n E --> G[esm.town API]\n F --> G\n G --> H[Response with
Content-Type]\n```\n\nThis adapter provides three platform-specific hooks to Hono's base `serveStatic`:\n\n- **`getContent(path)`** — Fetches file content from your val via `esm.town` using `std/utils`. TypeScript/TSX/JSX files are automatically transpiled to JavaScript.\n- **`isDir(path)`** — Heuristic check (paths without a file extension are treated as directories, triggering `index.html` fallback).\n- **`join(...paths)`** — Simple URL-style path concatenation (no filesystem needed).\n\n## Limitations\n\n- **Text files only.** Binary files (images, fonts, WASM, etc.) will be corrupted because `std/utils` reads all files as UTF-8 text via `res.text()`. Use external URLs, inline SVG, or icon fonts for images. This matches the current `std/utils` limitation.\n- **`precompressed` is a no-op.** Val Town doesn't store `.br`/`.gz` file variants, so the option is accepted but has no effect.\n- **No filesystem directories.** The `isDir` check uses a heuristic (no file extension = directory). Extensionless files like `LICENSE` or `Makefile` would be incorrectly treated as directories.\n","# vt-hono-serve-static\n\nA Val Town adapter for Hono's `serveStatic` middleware. Lets you use the\nstandard Hono `serveStatic` API — the same one used on Deno, Bun, Node, and\nCloudflare Workers — to serve static files from your val's project files.\n\n## Why?\n\nHono's built-in `serveStatic` middleware requires filesystem access\n(`Deno.open`, `node:fs`, etc.), which Val Town doesn't provide. The existing\n`std/utils` provides `staticHTTPServer()` and `serveFile()`, but these don't\nintegrate with Hono's middleware system.\n\nThis adapter bridges that gap — you get the full `serveStatic` API (`root`,\n`path`, `rewriteRequestPath`, `onFound`, `onNotFound`, `mimes`, etc.) working\nnatively on Val Town.\n\n## Usage\n\n```ts\nimport { Hono } from \"npm:hono@4\";\nimport { serveStatic } from \"https://esm.town/v/nbbaier/vt-hono-serve-static/main.ts\";\n\nconst app = new Hono();\n\n// Serve files under /static/* from the project root\napp.use(\"/static/*\", serveStatic({ root: \"./\" }));\n\n// Serve a specific file at a fixed path\napp.use(\"/favicon.ico\", serveStatic({ path: \"./favicon.ico\" }));\n\n// Rewrite request paths (e.g., /assets/* → /frontend/*)\napp.use(\n \"/assets/*\",\n serveStatic({\n root: \"./\",\n rewriteRequestPath: (path) => path.replace(/^\\/assets/, \"/frontend\"),\n }),\n);\n\n// Callbacks for cache headers or debugging\napp.use(\n \"/static/*\",\n serveStatic({\n root: \"./\",\n onFound: (path, c) => {\n c.header(\"Cache-Control\", \"public, max-age=3600\");\n },\n onNotFound: (path, c) => {\n console.log(`${path} not found, requested ${c.req.path}`);\n },\n }),\n);\n\napp.onError((err) => Promise.reject(err));\nexport default app.fetch;\n```\n\n## Options\n\nAll standard\n[Hono `ServeStaticOptions`](https://hono.dev/docs/getting-started/deno#serve-static-files)\nare supported:\n\n| Option | Type | Description |\n| -------------------- | ------------------------------------ | ----------------------------------------------------------------- |\n| `root` | `string` | Root directory for file resolution (e.g., `\"./\"`, `\"./frontend\"`) |\n| `path` | `string` | Serve a specific file regardless of request path |\n| `rewriteRequestPath` | `(path: string) => string` | Transform the request path before file lookup |\n| `mimes` | `Record` | Additional MIME type mappings |\n| `onFound` | `(path: string, c: Context) => void` | Called when a file is found |\n| `onNotFound` | `(path: string, c: Context) => void` | Called when a file is not found |\n| `precompressed` | `boolean` | Check for `.br`/`.gz` variants (no-op on Val Town) |\n\nPlus one Val Town-specific option:\n\n| Option | Type | Description |\n| --------------- | -------- | ------------------------------------------------------------------- |\n| `metaImportUrl` | `string` | Override `import.meta.url` for resolving files from a different val |\n\n## How It Works\n\n```mermaid\ngraph LR\n A[Hono Request] --> B[serveStatic middleware]\n B --> C[baseServeStatic
hono/serve-static]\n C --> D{getContent}\n D -->|.ts/.tsx/.jsx| E[readFileTranspiled
std/utils]\n D -->|other files| F[readFile
std/utils]\n E --> G[esm.town API]\n F --> G\n G --> H[Response with
Content-Type]\n```\n\nThis adapter provides three platform-specific hooks to Hono's base\n`serveStatic`:\n\n- **`getContent(path)`** — Fetches file content from your val via `esm.town`\n using `std/utils`. TypeScript/TSX/JSX files are automatically transpiled to\n JavaScript.\n- **`isDir(path)`** — Heuristic check (paths without a file extension are\n treated as directories, triggering `index.html` fallback).\n- **`join(...paths)`** — Simple URL-style path concatenation (no filesystem\n needed).\n\n## Limitations\n\n- **Text files only.** Binary files (images, fonts, WASM, etc.) will be\n corrupted because `std/utils` reads all files as UTF-8 text via `res.text()`.\n Use external URLs, inline SVG, or icon fonts for images. This matches the\n current `std/utils` limitation.\n- **`precompressed` is a no-op.** Val Town doesn't store `.br`/`.gz` file\n variants, so the option is accepted but has no effect.\n- **No filesystem directories.** The `isDir` check uses a heuristic (no file\n extension = directory). Extensionless files like `LICENSE` or `Makefile` would\n be incorrectly treated as directories.","createdAt",["D",1775400323592],"branchVersion","branchId","27ec018a-2fd4-11f1-b632-42dde27851f2","id","27eb4182-2fd4-11f1-b632-42dde27851f2","vt-hono-serve-static",["D",1775272367449],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","A Val Town adapter for Hono's serveStatic middleware","imageUrl","5d1042a9-7b0b-499d-8a72-3a8ac7a4e185","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount",1,"orgId","5f80108f-7ca4-4327-b77b-089dbe4b5a82","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_93":92,"_100":96},"org",{"_93":92,"_94":-5,"_95":96,"_18":54,"_97":98,"_99":25},"branch",{"_13":14,"_32":83,"_42":41,"_84":43,"_85":-5,"_86":-5,"_87":-5,"_88":-5,"_89":-5,"_90":44,"_91":92},"isOwned","main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","nbbaier","handle","displayName","avatar","https://secure.gravatar.com/avatar/0129a541b7b3574e92c4afd06c5e32da&d=identicon","tier","pro","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_42":43,"_32":44,"_37":235,"_46":-5,"_47":25,"_48":49,"_50":49,"_51":52,"_53":-5,"_18":54,"_55":-5,"_56":25,"_57":-5,"_58":-5,"_59":60,"_61":62,"_63":-5,"_64":-5,"_65":-5,"_66":-5,"_67":68,"_69":68,"_70":71,"_72":71,"_73":71,"_74":68,"_75":68,"_76":236,"_78":237,"_80":238,"_82":25},"tree",[160,168,169],"files",[160,161,162,163,164,165,166,167,168,169],"counts",{"_150":147,"_151":60,"_152":147,"_153":154,"_155":156},"contents",[124,125,126],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles",true,"grants","orgs","customDomains",{},{"_42":142,"_32":143,"_30":144,"_130":-5,"_40":41,"_39":145,"_132":119,"_37":146,"_13":147,"_33":148,"_34":-5,"_24":25,"_137":-5,"_27":149},{"_42":139,"_32":28,"_30":31,"_130":-5,"_40":41,"_39":14,"_132":119,"_37":140,"_13":60,"_33":20,"_34":36,"_24":25,"_137":-5,"_27":141},{"_42":127,"_32":128,"_30":129,"_130":-5,"_40":41,"_39":131,"_132":119,"_37":133,"_13":134,"_33":135,"_34":136,"_24":25,"_137":-5,"_27":138},"bf81444a-2fd6-11f1-a97d-42dde27851f2","main.ts","27ee61fa-2fd4-11f1-b632-42dde27851f2","parentId",16,"latest",["D",1775273480706],7,"script","import type { ServeStaticOptions } from \"npm:hono@4/serve-static\";\nimport { serveStatic as baseServeStatic } from \"npm:hono@4/serve-static\";\nimport type { Env, MiddlewareHandler } from \"npm:hono@4/types\";\nimport { getContentType } from \"https://esm.town/v/std/utils/serve-file.ts\";\nimport {\n readFile,\n readFileTranspiled,\n} from \"https://esm.town/v/std/utils/file.ts\";\n\n/**\n * Val Town adapter for Hono's serveStatic middleware.\n *\n * Serves static files from your val's project files using the same API\n * as `hono/deno`, `hono/bun`, etc.\n *\n * @example\n * ```ts\n * import { Hono } from \"npm:hono@4\";\n * import { serveStatic } from \"https://esm.town/v/nbbaier/vt-hono-server-static/main.ts\";\n *\n * const app = new Hono();\n * app.use(\"/static/*\", serveStatic({ root: \"./\" }));\n * app.use(\"/favicon.ico\", serveStatic({ path: \"./favicon.ico\" }));\n * export default app.fetch;\n * ```\n */\nexport const serveStatic = (\n options: ServeStaticOptions & {\n /**\n * Override the import.meta.url used to resolve val files.\n * Defaults to `Deno.env.get(\"VALTOWN_ENTRYPOINT\")`.\n * Useful when serving files from a different val.\n */\n metaImportUrl?: string;\n },\n): MiddlewareHandler => {\n const { metaImportUrl, ...restOptions } = options;\n\n return async function serveStatic(c, next) {\n const getContent = async (path: string) => {\n // Normalize: strip leading \"./\" and ensure leading \"/\"\n const normalizedPath = \"/\" + path.replace(/^\\.?\\//, \"\");\n console.log(normalizedPath);\n try {\n const needsTranspile = /\\.(tsx?|jsx)$/.test(normalizedPath);\n const content = needsTranspile\n ? await readFileTranspiled(normalizedPath, metaImportUrl)\n : await readFile(normalizedPath, metaImportUrl);\n\n if (content === undefined) return null;\n\n return new Response(content, {\n headers: { \"Content-Type\": getContentType(normalizedPath) },\n });\n } catch (err: any) {\n if (err.message?.includes(\"File not found\")) {\n return null;\n }\n throw err;\n }\n };\n\n const isDir = (path: string) => {\n const lastSegment = path.split(\"/\").filter(Boolean).pop() || \"\";\n return !lastSegment.includes(\".\");\n };\n\n const join = (...paths: string[]) => {\n return (\"/\" + paths.join(\"/\")).replace(/\\/+/g, \"/\").replace(/\\/$/, \"\") ||\n \"/\";\n };\n\n return baseServeStatic({\n ...restOptions,\n getContent,\n isDir,\n join,\n })(c, next);\n };\n};","label",[128],"13bb030c-30fe-11f1-a0b3-42dde27851f2",["D",1775400323592],[28],"d9f4b664-2fd5-11f1-9f1f-42dde27851f2","test","d9f4b70e-2fd5-11f1-9f1f-42dde27851f2",4,["D",1775273095638],0,"directory",[143],"pulls","branches","forks","envVars",{"_157":147,"_159":147},"connections",{"_157":147,"_158":147},"count","unfilledCount","emptyCount",{"_42":142,"_32":143,"_30":144,"_130":-5,"_40":41,"_39":145,"_132":119,"_37":232,"_13":147,"_33":148,"_34":-5,"_24":25,"_137":-5,"_171":233,"_27":234},{"_42":228,"_32":195,"_30":190,"_130":144,"_40":41,"_39":207,"_132":119,"_37":229,"_13":147,"_33":148,"_34":-5,"_24":25,"_137":-5,"_171":230,"_27":231},{"_42":220,"_32":221,"_30":222,"_130":190,"_40":41,"_39":223,"_132":119,"_37":224,"_13":147,"_33":20,"_34":225,"_24":25,"_137":-5,"_171":226,"_27":227},{"_42":212,"_32":213,"_30":214,"_130":190,"_40":41,"_39":215,"_132":119,"_37":216,"_13":147,"_33":20,"_34":217,"_24":25,"_137":-5,"_171":218,"_27":219},{"_42":204,"_32":205,"_30":206,"_130":190,"_40":41,"_39":207,"_132":119,"_37":208,"_13":147,"_33":20,"_34":209,"_24":25,"_137":-5,"_171":210,"_27":211},{"_42":196,"_32":197,"_30":198,"_130":190,"_40":41,"_39":199,"_132":119,"_37":200,"_13":147,"_33":20,"_34":201,"_24":25,"_137":-5,"_171":202,"_27":203},{"_42":187,"_32":188,"_30":189,"_130":190,"_40":41,"_39":134,"_132":119,"_37":191,"_13":147,"_33":20,"_34":192,"_24":25,"_137":-5,"_171":193,"_27":194},{"_42":177,"_32":178,"_30":179,"_130":144,"_40":41,"_39":180,"_132":119,"_37":181,"_13":182,"_33":183,"_34":184,"_24":25,"_137":-5,"_171":185,"_27":186},{"_42":139,"_32":28,"_30":31,"_130":-5,"_40":41,"_39":14,"_132":119,"_37":174,"_13":60,"_33":20,"_34":36,"_24":25,"_137":-5,"_171":175,"_27":176},{"_42":127,"_32":128,"_30":129,"_130":-5,"_40":41,"_39":131,"_132":119,"_37":170,"_13":134,"_33":135,"_34":136,"_24":25,"_137":-5,"_171":172,"_27":173},["D",1775273480706],"children",[],[128],["D",1775400323592],[],[28],"ca2ebc4c-2fd6-11f1-b239-42dde27851f2","server.ts","e6d1eed8-2fd5-11f1-b11f-42dde27851f2",19,["D",1775273498667],3,"http","import { Hono } from \"npm:hono@4\";\nimport { serveStatic } from \"../main.ts\";\n\nconst app = new Hono();\n\n// Serve static files under /static/* from test/static/\napp.use(\n \"/static/*\",\n serveStatic({\n root: \"./test\",\n rewriteRequestPath: (path) => path,\n }),\n);\n\n// Serve index.html at root\napp.get(\"/\", serveStatic({ path: \"./test/static/index.html\" }));\n\n// API route to prove middleware doesn't interfere\napp.get(\"/api/health\", (c) => c.json({ status: \"ok\" }));\n\napp.onError((err) => Promise.reject(err));\nexport default app.fetch;",[],[143,178],"e0098c78-2fd5-11f1-a1aa-42dde27851f2","style.css","e0098d5e-2fd5-11f1-a1aa-42dde27851f2","c0621f58-e2e6-4b4c-8689-ee3553605f9f",["D",1775273105839],"body {\n font-family: system-ui, sans-serif;\n max-width: 600px;\n margin: 2rem auto;\n padding: 0 1rem;\n color: #333;\n}\nh1 { color: #6366f1; }",[],[143,195,188],"static","df54b10e-2fd5-11f1-9f1f-42dde27851f2","index.html","df54b1c2-2fd5-11f1-9f1f-42dde27851f2",6,["D",1775273104656],"\n\n\n \n serveStatic Test\n \n\n\n

It works!

This page is served by Hono's serveStatic middleware on Val Town.

hello.txt
data.json

\n \n\n",[],[143,195,197],"dd544eaa-2fd5-11f1-9f1f-42dde27851f2","hello.txt","dd544f7c-2fd5-11f1-9f1f-42dde27851f2",5,["D",1775273101296],"Hello from Val Town static files!",[],[143,195,205],"e0cac62c-2fd5-11f1-b11f-42dde27851f2","data.json","e0cac744-2fd5-11f1-b11f-42dde27851f2",8,["D",1775273107101],"{ \"message\": \"JSON served via serveStatic\", \"ok\": true }",[],[143,195,213],"e1f8c012-2fd5-11f1-b11f-42dde27851f2","app.ts","e1f8c0a8-2fd5-11f1-b11f-42dde27851f2",9,["D",1775273109061],"const msg: string = \"TypeScript transpiled and served correctly!\";\nconsole.log(msg);\ndocument.querySelector(\"body\")?.insertAdjacentHTML(\n \"beforeend\",\n `

${msg}

`,\n);",[],[143,195,221],"dd546e9e-2fd5-11f1-9f1f-42dde27851f2",["D",1775273101296],[162,163,164,165,166],[143,195],["D",1775273095638],[161,167],[143],["D",1775272367449],{"_93":92,"_100":96},{"_93":92,"_94":-5,"_95":96,"_18":54,"_97":98,"_99":25},{"_13":14,"_32":83,"_42":41,"_84":43,"_85":-5,"_86":-5,"_87":-5,"_88":-5,"_89":-5,"_90":44,"_91":92},"ctx",{"_76":-5,"_121":272,"_273":274,"_275":276,"_277":25,"_278":25,"_279":25,"_280":119,"_281":-5,"_282":-7,"_283":-7,"_284":147,"_285":25,"_286":25,"_287":-5,"_288":25,"_289":25,"_290":25,"_291":-5},"ENV",{"_243":244,"_245":246,"_247":83,"_248":249,"_250":251,"_252":253,"_254":255,"_256":257,"_258":259,"_260":261,"_262":263,"_264":265,"_266":267,"_268":269,"_270":271},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Diff · v20