react-client 1.0.27 → 1.0.28

package/README.md

@@ -91,7 +91,6 @@ Each template is pre-configured for esbuild, HMR, and fast bootstrapping.
 - 🔍 **Source Map Stack Mapping** — Maps runtime errors to original TS/JS source lines  
 - 💬 **Auto Port Detection** — Prompts when default port 2202 is occupied  
 - 🧠 **Smart Config Loader** — Detects project root, compiles `.ts` configs dynamically  
-- 🎨 **PrismJS Highlighting** — For pretty overlay code frames  
 - 🔌 **Plugin Hook System** — Extendable with `configResolved`, `transform`, `buildEnd`  
 
 ---
@@ -104,7 +103,6 @@ Each template is pre-configured for esbuild, HMR, and fast bootstrapping.
 2. **Connect** serves files and APIs (React Refresh runtime, overlay, source-map).  
 3. **WebSocket** pushes HMR updates and overlay messages.  
 4. **Chokidar** watches `/src` for changes and triggers rebuilds.  
-5. **Overlay UI** (via PrismJS) displays mapped stack frames with syntax highlighting.
 
 ---
 

package/dist/cli/commands/dev.js

@@ -232,20 +232,8 @@ async function dev() {
             res.end(`// Failed to resolve module ${id}: ${err.message}`);
         }
     });
-    app.use(async (req, res, next) => {
-        if (req.url?.startsWith('/@prismjs')) {
-            const prismPath = require.resolve('prismjs', { paths: [appRoot] });
-            const code = await fs_extra_1.default.readFile(prismPath, 'utf8');
-            res.setHeader('Content-Type', 'application/javascript');
-            return res.end(code);
-        }
-        next();
-    });
-    // --- Serve runtime overlay (local file) so overlay-runtime.js is loaded automatically
-    // --- Serve runtime overlay (inline in dev server)
+    // --- Serve runtime overlay (inline, no external dependencies)
     const OVERLAY_RUNTIME = `
-import "/@prismjs";
-
 const overlayId = "__rc_error_overlay__";
 
 const style = document.createElement("style");
@@ -264,11 +252,11 @@ style.textContent = \`
   }
   @keyframes fadeIn { from {opacity: 0;} to {opacity: 1;} }
   #\${overlayId} h2 { color: #ff6b6b; margin-bottom: 16px; }
-  #\${overlayId} pre { background: rgba(255,255,255,0.1); padding: 12px; border-radius: 6px; }
+  #\${overlayId} pre { background: rgba(255,255,255,0.1); padding: 12px; border-radius: 6px; overflow-x: auto; }
   #\${overlayId} a { color: #9cf; text-decoration: underline; }
   #\${overlayId} .frame { margin: 12px 0; }
   #\${overlayId} .frame-file { color: #ffa500; cursor: pointer; font-weight: bold; margin-bottom: 4px; }
-  .line-number { opacity: 0.5; margin-right: 10px; }
+  .line-number { opacity: 0.5; margin-right: 10px; display: inline-block; width: 2em; text-align: right; }
 \`;
 document.head.appendChild(style);
 
@@ -290,6 +278,14 @@ async function mapStackFrame(frame) {
   return frame;
 }
 
+// 🔹 minimal inline syntax highlighting (keywords only)
+function highlightJS(code) {
+  return code
+    .replace(/(const|let|var|function|return|import|from|export|class|new|await|async|if|else|for|while|try|catch|throw)/g, '<span style="color:#ffb86c;">$1</span>')
+    .replace(/("[^"]*"|'[^']*')/g, '<span style="color:#8be9fd;">$1</span>')
+    .replace(/(\\/\\/.*)/g, '<span style="opacity:0.6;">$1</span>');
+}
+
 async function renderOverlay(err) {
   const overlay =
     document.getElementById(overlayId) ||
@@ -315,8 +311,7 @@ async function renderOverlay(err) {
 
     if (mapped.snippet) {
       const pre = document.createElement("pre");
-      pre.classList.add("language-jsx");
-      pre.innerHTML = Prism.highlight(mapped.snippet, Prism.languages.jsx, "jsx");
+      pre.innerHTML = highlightJS(mapped.snippet);
       frameEl.appendChild(pre);
     }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-client",
-  "version": "1.0.27",
+  "version": "1.0.28",
   "description": "react-client is a lightweight CLI and runtime for building React apps with fast iteration.",
   "license": "MIT",
   "author": "Venkatesh Sundaram",
@@ -102,7 +102,6 @@
     "esbuild": "^0.25.12",
     "fs-extra": "^11.3.2",
     "open": "^8.4.2",
-    "prismjs": "^1.30.0",
     "prompts": "^2.4.2",
     "react-refresh": "^0.14.0",
     "serve-static": "^1.15.0",