create-volt 0.56.0 → 0.56.1

package/CHANGELOG.md

@@ -4,6 +4,15 @@ All notable changes to `create-volt` are documented here. The format follows
 [Keep a Changelog](https://keepachangelog.com/), and this project adheres to
 [Semantic Versioning](https://semver.org/).
 
+## [0.56.1] - 2026-07-05
+
+### Fixed
+- **Media library thumbnails / editor image previews showed as broken inside the
+  config.** The config server served a fixed asset allowlist and had no `/media/`
+  route, so uploaded files 404'd in the config UI — even though they uploaded fine
+  and render on the live site (the running app serves them via `express.static`).
+  The config now serves `public/media/<name>` with a path-traversal guard.
+
 ## [0.56.0] - 2026-07-05
 
 ### Added
@@ -745,6 +754,7 @@ All notable changes to `create-volt` are documented here. The format follows
   watching and full-page hot reload. Supports `--skip-install` and `--force`,
   and auto-detects npm / pnpm / yarn / bun for the install step.
 
+[0.56.1]: https://github.com/MIR-2025/volt/releases/tag/v0.56.1
 [0.56.0]: https://github.com/MIR-2025/volt/releases/tag/v0.56.0
 [0.55.1]: https://github.com/MIR-2025/volt/releases/tag/v0.55.1
 [0.55.0]: https://github.com/MIR-2025/volt/releases/tag/v0.55.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-volt",
-  "version": "0.56.0",
+  "version": "0.56.1",
   "description": "Scaffold a new Volt app — no-build, signals-based UI with Socket.io hot reload.",
   "type": "module",
   "bin": {

package/templates/blog/server.js

@@ -313,6 +313,20 @@ function startSetup() {
       res.setHeader("Content-Type", assets[p][0]);
       return res.end(assets[p][1]);
     }
+    // Serve uploaded media so library thumbnails + editor previews render inside the
+    // config (the running app serves these via express.static; the config didn't).
+    if (req.method === "GET" && p.startsWith("/media/")) {
+      const base = path.join(__dirname, "public", "media");
+      const f = path.resolve(base, decodeURIComponent(p.slice("/media/".length)));
+      if ((f === base || f.startsWith(base + path.sep)) && fs.existsSync(f) && fs.statSync(f).isFile()) {
+        const ext = (f.split(".").pop() || "").toLowerCase();
+        const mime = { png: "image/png", jpg: "image/jpeg", jpeg: "image/jpeg", gif: "image/gif", webp: "image/webp", avif: "image/avif", svg: "image/svg+xml", bmp: "image/bmp", ico: "image/x-icon", mp4: "video/mp4", webm: "video/webm", mov: "video/quicktime", ogv: "video/ogg", m4v: "video/x-m4v", ogg: "audio/ogg", mp3: "audio/mpeg", wav: "audio/wav" }[ext] || "application/octet-stream";
+        res.setHeader("Content-Type", mime);
+        return res.end(fs.readFileSync(f));
+      }
+      res.statusCode = 404;
+      return res.end("not found");
+    }
     if (req.method === "GET" && p === "/setup/state") {
       res.setHeader("Content-Type", "application/json");
       return res.end(JSON.stringify({ available: availableAddons(), themes: availableThemes(), current: readEnvFile(), defaultPort: DEFAULT_PORT, configDefaultPort: CONFIG_DEFAULT_PORT }));

package/templates/business/server.js

@@ -313,6 +313,20 @@ function startSetup() {
       res.setHeader("Content-Type", assets[p][0]);
       return res.end(assets[p][1]);
     }
+    // Serve uploaded media so library thumbnails + editor previews render inside the
+    // config (the running app serves these via express.static; the config didn't).
+    if (req.method === "GET" && p.startsWith("/media/")) {
+      const base = path.join(__dirname, "public", "media");
+      const f = path.resolve(base, decodeURIComponent(p.slice("/media/".length)));
+      if ((f === base || f.startsWith(base + path.sep)) && fs.existsSync(f) && fs.statSync(f).isFile()) {
+        const ext = (f.split(".").pop() || "").toLowerCase();
+        const mime = { png: "image/png", jpg: "image/jpeg", jpeg: "image/jpeg", gif: "image/gif", webp: "image/webp", avif: "image/avif", svg: "image/svg+xml", bmp: "image/bmp", ico: "image/x-icon", mp4: "video/mp4", webm: "video/webm", mov: "video/quicktime", ogv: "video/ogg", m4v: "video/x-m4v", ogg: "audio/ogg", mp3: "audio/mpeg", wav: "audio/wav" }[ext] || "application/octet-stream";
+        res.setHeader("Content-Type", mime);
+        return res.end(fs.readFileSync(f));
+      }
+      res.statusCode = 404;
+      return res.end("not found");
+    }
     if (req.method === "GET" && p === "/setup/state") {
       res.setHeader("Content-Type", "application/json");
       return res.end(JSON.stringify({ available: availableAddons(), themes: availableThemes(), current: readEnvFile(), defaultPort: DEFAULT_PORT, configDefaultPort: CONFIG_DEFAULT_PORT }));

package/templates/default/server.js

@@ -313,6 +313,20 @@ function startSetup() {
       res.setHeader("Content-Type", assets[p][0]);
       return res.end(assets[p][1]);
     }
+    // Serve uploaded media so library thumbnails + editor previews render inside the
+    // config (the running app serves these via express.static; the config didn't).
+    if (req.method === "GET" && p.startsWith("/media/")) {
+      const base = path.join(__dirname, "public", "media");
+      const f = path.resolve(base, decodeURIComponent(p.slice("/media/".length)));
+      if ((f === base || f.startsWith(base + path.sep)) && fs.existsSync(f) && fs.statSync(f).isFile()) {
+        const ext = (f.split(".").pop() || "").toLowerCase();
+        const mime = { png: "image/png", jpg: "image/jpeg", jpeg: "image/jpeg", gif: "image/gif", webp: "image/webp", avif: "image/avif", svg: "image/svg+xml", bmp: "image/bmp", ico: "image/x-icon", mp4: "video/mp4", webm: "video/webm", mov: "video/quicktime", ogv: "video/ogg", m4v: "video/x-m4v", ogg: "audio/ogg", mp3: "audio/mpeg", wav: "audio/wav" }[ext] || "application/octet-stream";
+        res.setHeader("Content-Type", mime);
+        return res.end(fs.readFileSync(f));
+      }
+      res.statusCode = 404;
+      return res.end("not found");
+    }
     if (req.method === "GET" && p === "/setup/state") {
       res.setHeader("Content-Type", "application/json");
       return res.end(JSON.stringify({ available: availableAddons(), themes: availableThemes(), current: readEnvFile(), defaultPort: DEFAULT_PORT, configDefaultPort: CONFIG_DEFAULT_PORT }));

package/templates/docs/server.js

@@ -313,6 +313,20 @@ function startSetup() {
       res.setHeader("Content-Type", assets[p][0]);
       return res.end(assets[p][1]);
     }
+    // Serve uploaded media so library thumbnails + editor previews render inside the
+    // config (the running app serves these via express.static; the config didn't).
+    if (req.method === "GET" && p.startsWith("/media/")) {
+      const base = path.join(__dirname, "public", "media");
+      const f = path.resolve(base, decodeURIComponent(p.slice("/media/".length)));
+      if ((f === base || f.startsWith(base + path.sep)) && fs.existsSync(f) && fs.statSync(f).isFile()) {
+        const ext = (f.split(".").pop() || "").toLowerCase();
+        const mime = { png: "image/png", jpg: "image/jpeg", jpeg: "image/jpeg", gif: "image/gif", webp: "image/webp", avif: "image/avif", svg: "image/svg+xml", bmp: "image/bmp", ico: "image/x-icon", mp4: "video/mp4", webm: "video/webm", mov: "video/quicktime", ogv: "video/ogg", m4v: "video/x-m4v", ogg: "audio/ogg", mp3: "audio/mpeg", wav: "audio/wav" }[ext] || "application/octet-stream";
+        res.setHeader("Content-Type", mime);
+        return res.end(fs.readFileSync(f));
+      }
+      res.statusCode = 404;
+      return res.end("not found");
+    }
     if (req.method === "GET" && p === "/setup/state") {
       res.setHeader("Content-Type", "application/json");
       return res.end(JSON.stringify({ available: availableAddons(), themes: availableThemes(), current: readEnvFile(), defaultPort: DEFAULT_PORT, configDefaultPort: CONFIG_DEFAULT_PORT }));

package/templates/starter/server.js

@@ -338,6 +338,20 @@ function startSetup() {
       res.setHeader("Content-Type", assets[p][0]);
       return res.end(assets[p][1]);
     }
+    // Serve uploaded media so library thumbnails + editor previews render inside the
+    // config (the running app serves these via express.static; the config didn't).
+    if (req.method === "GET" && p.startsWith("/media/")) {
+      const base = path.join(__dirname, "public", "media");
+      const f = path.resolve(base, decodeURIComponent(p.slice("/media/".length)));
+      if ((f === base || f.startsWith(base + path.sep)) && fs.existsSync(f) && fs.statSync(f).isFile()) {
+        const ext = (f.split(".").pop() || "").toLowerCase();
+        const mime = { png: "image/png", jpg: "image/jpeg", jpeg: "image/jpeg", gif: "image/gif", webp: "image/webp", avif: "image/avif", svg: "image/svg+xml", bmp: "image/bmp", ico: "image/x-icon", mp4: "video/mp4", webm: "video/webm", mov: "video/quicktime", ogv: "video/ogg", m4v: "video/x-m4v", ogg: "audio/ogg", mp3: "audio/mpeg", wav: "audio/wav" }[ext] || "application/octet-stream";
+        res.setHeader("Content-Type", mime);
+        return res.end(fs.readFileSync(f));
+      }
+      res.statusCode = 404;
+      return res.end("not found");
+    }
     if (req.method === "GET" && p === "/setup/state") {
       res.setHeader("Content-Type", "application/json");
       return res.end(JSON.stringify({ available: availableAddons(), themes: availableThemes(), current: readEnvFile(), defaultPort: DEFAULT_PORT, configDefaultPort: CONFIG_DEFAULT_PORT }));