mnfst-run 1.0.0

package/bin/mnfst-run.js

@@ -0,0 +1,2 @@
+#!/usr/bin/env node
+import '../serve.mjs';

package/package.json

@@ -0,0 +1,30 @@
+{
+  "name": "mnfst-run",
+  "version": "1.0.0",
+  "description": "Zero-dependency dev server for Manifest projects",
+  "type": "module",
+  "bin": {
+    "mnfst-run": "./bin/mnfst-run.js"
+  },
+  "files": [
+    "bin",
+    "serve.mjs",
+    "README.md"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "keywords": [
+    "manifest",
+    "mnfst",
+    "serve",
+    "dev-server"
+  ],
+  "author": "Andrew Matlock",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/andrewmatlock/Manifest.git",
+    "directory": "packages/run"
+  }
+}

package/serve.mjs

@@ -0,0 +1,185 @@
+#!/usr/bin/env node
+/**
+ * mnfst-run — zero-dependency dev server for Manifest projects.
+ *
+ * Usage:
+ *   npx mnfst-run [dir] [--port 5001]
+ *
+ *   dir    Directory to serve (default: current directory). Any depth of
+ *          nesting is valid, e.g. npx mnfst-run docs/articles/publishing
+ *   --port Preferred port (default: PORT env var, then 5001). Auto-increments
+ *          if the port is already in use.
+ *
+ * SPA vs MPA is auto-detected: if the root index.html contains
+ * <meta name="manifest:prerendered"> the server disables SPA fallback.
+ *
+ * Live reload: CSS changes hot-swap the stylesheet without a page reload.
+ * All other file changes trigger a full browser refresh.
+ */
+import { createServer }            from 'http';
+import { readFileSync, statSync, watch } from 'fs';
+import { join, extname, resolve }  from 'path';
+
+const MIME = {
+  '.html': 'text/html; charset=utf-8',
+  '.js':   'application/javascript; charset=utf-8',
+  '.mjs':  'application/javascript; charset=utf-8',
+  '.css':  'text/css; charset=utf-8',
+  '.json': 'application/json; charset=utf-8',
+  '.svg':  'image/svg+xml',
+  '.png':  'image/png',
+  '.jpg':  'image/jpeg',
+  '.jpeg': 'image/jpeg',
+  '.gif':  'image/gif',
+  '.webp': 'image/webp',
+  '.ico':  'image/x-icon',
+  '.woff': 'font/woff',
+  '.woff2':'font/woff2',
+  '.ttf':  'font/ttf',
+  '.xml':  'application/xml; charset=utf-8',
+  '.txt':  'text/plain; charset=utf-8',
+  '.md':   'text/plain; charset=utf-8',
+  '.webmanifest': 'application/manifest+json',
+  '.map':  'application/json',
+};
+
+// Injected into every HTML response — connects to the SSE stream and handles
+// CSS hot-swap or full reload depending on what changed.
+const LIVE_RELOAD_SCRIPT = `<script>
+(function () {
+  var es = new EventSource('/__mnfst_sse__');
+  es.onmessage = function (e) {
+    var d = JSON.parse(e.data);
+    if (d.type === 'css') {
+      document.querySelectorAll('link[rel="stylesheet"]').forEach(function (l) {
+        var base = l.href.split('?')[0];
+        if (base.endsWith(d.file)) l.href = base + '?t=' + Date.now();
+      });
+    } else {
+      location.reload();
+    }
+  };
+  es.onerror = function () { es.close(); };
+})();
+</script>`;
+
+// --- CLI args ---
+const args = process.argv.slice(2);
+let dir  = '.';
+let port = process.env.PORT ? parseInt(process.env.PORT, 10) : 5001;
+
+for (let i = 0; i < args.length; i++) {
+  if ((args[i] === '--port' || args[i] === '-p') && args[i + 1]) { port = parseInt(args[++i], 10); continue; }
+  if (!args[i].startsWith('-')) dir = args[i];
+}
+
+const root = resolve(process.cwd(), dir);
+
+// --- Auto-detect MPA ---
+function detectMPA(rootDir) {
+  try {
+    return /name=["']manifest:prerendered["']/i.test(readFileSync(join(rootDir, 'index.html'), 'utf8'));
+  } catch { return false; }
+}
+const spa  = !detectMPA(root);
+const mode = spa ? 'SPA' : 'MPA';
+
+// --- SSE clients ---
+let clients = [];
+let debounce = null;
+
+function broadcast(data) {
+  const msg = `data: ${JSON.stringify(data)}\n\n`;
+  clients.forEach(res => { try { res.write(msg); } catch { /* client gone */ } });
+}
+
+// --- File watcher ---
+const IGNORE = /node_modules|\.git/;
+try {
+  watch(root, { recursive: true }, (_event, filename) => {
+    if (!filename || IGNORE.test(filename)) return;
+    clearTimeout(debounce);
+    debounce = setTimeout(() => {
+      const ext = extname(filename).toLowerCase();
+      if (ext === '.css') {
+        broadcast({ type: 'css', file: '/' + filename.replace(/\\/g, '/') });
+      } else {
+        broadcast({ type: 'reload' });
+      }
+    }, 60);
+  });
+} catch {
+  // fs.watch unavailable in this environment — live reload disabled
+}
+
+// --- File serving ---
+function isFile(p) {
+  try { return statSync(p).isFile(); } catch { return false; }
+}
+
+function serveFile(res, filePath) {
+  const ext  = extname(filePath).toLowerCase();
+  const mime = MIME[ext] || 'application/octet-stream';
+  let body   = readFileSync(filePath);
+  if (ext === '.html') {
+    let html = body.toString('utf8');
+    // Inject before </body>; fall back to appending if tag absent
+    html = html.includes('</body>')
+      ? html.replace('</body>', LIVE_RELOAD_SCRIPT + '</body>')
+      : html + LIVE_RELOAD_SCRIPT;
+    body = Buffer.from(html, 'utf8');
+  }
+  res.writeHead(200, { 'Content-Type': mime });
+  res.end(body);
+}
+
+// --- HTTP server ---
+const server = createServer((req, res) => {
+  const urlPath = decodeURIComponent(req.url.split('?')[0]);
+
+  // SSE endpoint for live reload
+  if (urlPath === '/__mnfst_sse__') {
+    res.writeHead(200, {
+      'Content-Type':  'text/event-stream',
+      'Cache-Control': 'no-cache',
+      'Connection':    'keep-alive',
+    });
+    res.write(':\n\n'); // initial keep-alive comment
+    clients.push(res);
+    req.on('close', () => { clients = clients.filter(c => c !== res); });
+    return;
+  }
+
+  const exact = join(root, urlPath);
+  if (isFile(exact)) return serveFile(res, exact);
+
+  const index = join(root, urlPath.replace(/\/$/, ''), 'index.html');
+  if (isFile(index)) return serveFile(res, index);
+
+  if (spa) {
+    const fallback = join(root, 'index.html');
+    if (isFile(fallback)) return serveFile(res, fallback);
+  }
+
+  res.writeHead(404, { 'Content-Type': 'text/plain; charset=utf-8' });
+  res.end('404 Not Found');
+});
+
+// --- Auto-port ---
+function tryListen(p, attempt = 0) {
+  if (attempt > 20) {
+    console.error('mnfst-run: could not find a free port after 20 attempts.');
+    process.exit(1);
+  }
+  server.once('error', err => {
+    if (err.code === 'EADDRINUSE') tryListen(p + 1, attempt + 1);
+    else throw err;
+  });
+  server.listen(p, () => {
+    if (p !== port) console.log(`mnfst-run: port ${port} in use, using ${p} instead.`);
+    console.log(`\n  mnfst-run  [${mode}]  http://localhost:${p}`);
+    console.log(`             root: ${root}\n`);
+  });
+}
+
+tryListen(port);