react-client 1.0.15 → 1.0.17

package/dist/cli/commands/dev.js

@@ -24,7 +24,7 @@ async function dev() {
     const defaultPort = userConfig.server?.port || 5173;
     const cacheDir = path_1.default.join(appRoot, '.react-client', 'deps');
     await fs_extra_1.default.ensureDir(cacheDir);
-    // Detect entry dynamically (main.tsx or main.jsx)
+    // 🔍 Dynamically detect entry (main.tsx or main.jsx)
     const possibleEntries = ['src/main.tsx', 'src/main.jsx'];
     const entry = possibleEntries.map((p) => path_1.default.join(appRoot, p)).find((p) => fs_extra_1.default.existsSync(p));
     if (!entry) {
@@ -32,7 +32,7 @@ async function dev() {
         process.exit(1);
     }
     const indexHtml = path_1.default.join(appRoot, 'index.html');
-    // Detect open port
+    // 🧭 Port selection
     const availablePort = await (0, detect_port_1.default)(defaultPort);
     const port = availablePort;
     if (availablePort !== defaultPort) {
@@ -47,7 +47,7 @@ async function dev() {
             process.exit(0);
         }
     }
-    // ⚡ React-refresh runtime auto install
+    // ⚡ Ensure react-refresh runtime installed
     function safeResolveReactRefresh() {
         try {
             return require.resolve('react-refresh/runtime');
@@ -61,9 +61,8 @@ async function dev() {
             return require.resolve('react-refresh/runtime');
         }
     }
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    const _reactRefreshRuntime = safeResolveReactRefresh();
-    // --- Plugins (core + user)
+    void safeResolveReactRefresh();
+    // 🧩 Core + user plugins
     const corePlugins = [
         {
             name: 'css-hmr',
@@ -71,12 +70,12 @@ async function dev() {
                 if (id.endsWith('.css')) {
                     const escaped = JSON.stringify(code);
                     return `
-          const css = ${escaped};
-          const style = document.createElement('style');
-          style.textContent = css;
-          document.head.appendChild(style);
-          import.meta.hot && import.meta.hot.accept();
-        `;
+            const css = ${escaped};
+            const style = document.createElement('style');
+            style.textContent = css;
+            document.head.appendChild(style);
+            import.meta.hot && import.meta.hot.accept();
+          `;
                 }
                 return code;
             },
@@ -84,10 +83,10 @@ async function dev() {
     ];
     const userPlugins = Array.isArray(userConfig.plugins) ? userConfig.plugins : [];
     const plugins = [...corePlugins, ...userPlugins];
-    // 🧱 Connect app
+    // 🌐 Connect app + caches
     const app = (0, connect_1.default)();
     const transformCache = new Map();
-    // --- Prebundle persistent deps
+    // 📦 Prebundle persistent deps
     async function prebundleDeps() {
         const pkgFile = path_1.default.join(appRoot, 'package.json');
         if (!fs_extra_1.default.existsSync(pkgFile))
@@ -117,13 +116,13 @@ async function dev() {
                 console.log(chalk_1.default.green(`✅ Cached ${dep}`));
             }
             catch (err) {
-                const msg = err instanceof Error ? err.message : String(err);
-                console.warn(chalk_1.default.yellow(`⚠️ Skipped ${dep}: ${msg}`));
+                const e = err;
+                console.warn(chalk_1.default.yellow(`⚠️ Skipped ${dep}: ${e.message}`));
             }
         }
     }
     await prebundleDeps();
-    // --- Serve prebundled modules
+    // --- Serve prebundled modules (fixed resolver)
     app.use('/@modules/', async (req, res, next) => {
         const id = req.url?.replace(/^\/@modules\//, '');
         if (!id)
@@ -134,7 +133,23 @@ async function dev() {
                 res.setHeader('Content-Type', 'application/javascript');
                 return res.end(await fs_extra_1.default.readFile(cacheFile));
             }
-            const entryPath = require.resolve(id, { paths: [appRoot] });
+            let entryPath = null;
+            try {
+                entryPath = require.resolve(id, { paths: [path_1.default.join(appRoot, 'node_modules')] });
+            }
+            catch {
+                try {
+                    entryPath = require.resolve(id, { paths: [root] });
+                }
+                catch {
+                    if (id === 'react')
+                        entryPath = require.resolve('react');
+                    else if (id === 'react-dom' || id === 'react-dom/client')
+                        entryPath = require.resolve('react-dom');
+                }
+            }
+            if (!entryPath)
+                throw new Error(`Could not resolve ${id}`);
             const result = await esbuild_1.default.build({
                 entryPoints: [entryPath],
                 bundle: true,
@@ -144,6 +159,7 @@ async function dev() {
                 write: false,
             });
             let code = result.outputFiles[0].text;
+            // ✅ Fix for react-dom/client exports
             if (id === 'react-dom/client') {
                 code += `
           import * as ReactDOMClient from '/@modules/react-dom';
@@ -156,16 +172,25 @@ async function dev() {
             res.end(code);
         }
         catch (err) {
-            const msg = err instanceof Error ? err.message : String(err);
+            const e = err;
+            console.error(chalk_1.default.red(`❌ Failed to load module ${id}: ${e.message}`));
             res.writeHead(500);
-            res.end(`// Failed to resolve module ${id}: ${msg}`);
+            res.end(`// Failed to resolve module ${id}: ${e.message}`);
         }
     });
-    // --- Serve /src files dynamically
+    // --- Serve /src files dynamically (auto extension fallback)
     app.use(async (req, res, next) => {
         if (!req.url || (!req.url.startsWith('/src/') && !req.url.endsWith('.css')))
             return next();
-        const filePath = path_1.default.join(appRoot, decodeURIComponent(req.url.split('?')[0]));
+        const rawPath = decodeURIComponent(req.url.split('?')[0]);
+        let filePath = path_1.default.join(appRoot, rawPath);
+        const possibleExts = ['', '.tsx', '.ts', '.jsx', '.js'];
+        for (const ext of possibleExts) {
+            if (await fs_extra_1.default.pathExists(filePath + ext)) {
+                filePath += ext;
+                break;
+            }
+        }
         if (!(await fs_extra_1.default.pathExists(filePath)))
             return next();
         try {
@@ -174,10 +199,13 @@ async function dev() {
                 return res.end(transformCache.get(filePath));
             }
             let code = await fs_extra_1.default.readFile(filePath, 'utf8');
-            for (const p of plugins) {
+            // Rewrite bare imports → /@modules/*
+            code = code
+                .replace(/\bfrom\s+['"]([^'".\/][^'"]*)['"]/g, (_match, dep) => `from "/@modules/${dep}"`)
+                .replace(/\bimport\(['"]([^'".\/][^'"]*)['"]\)/g, (_match, dep) => `import("/@modules/${dep}")`);
+            for (const p of plugins)
                 if (p.onTransform)
                     code = await p.onTransform(code, filePath);
-            }
             const ext = path_1.default.extname(filePath);
             let loader = 'js';
             if (ext === '.ts')
@@ -196,12 +224,13 @@ async function dev() {
             res.end(result.code);
         }
         catch (err) {
-            const msg = err instanceof Error ? err.message : String(err);
+            const e = err;
+            console.error(chalk_1.default.red(`⚠️ Transform failed: ${e.message}`));
             res.writeHead(500);
-            res.end(`// Error: ${msg}`);
+            res.end(`// Error: ${e.message}`);
         }
     });
-    // --- Serve index.html with overlay + HMR client
+    // --- Serve index.html + overlay + HMR client
     app.use(async (req, res, next) => {
         if (req.url !== '/' && req.url !== '/index.html')
             return next();
@@ -256,7 +285,7 @@ async function dev() {
         console.log(chalk_1.default.yellow(`🔄 Changed: ${file}`));
         transformCache.delete(file);
         for (const p of plugins) {
-            p.onHotUpdate?.(file, {
+            await p.onHotUpdate?.(file, {
                 broadcast: (msg) => broadcaster.broadcast(msg),
             });
         }
@@ -265,7 +294,7 @@ async function dev() {
             path: '/' + path_1.default.relative(appRoot, file).replace(/\\/g, '/'),
         });
     });
-    // 🚀 Launch
+    // 🚀 Start server
     server.listen(port, async () => {
         const url = `http://localhost:${port}`;
         console.log(chalk_1.default.cyan.bold('\n🚀 React Client Dev Server'));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-client",
-  "version": "1.0.15",
+  "version": "1.0.17",
   "description": "react-client is a lightweight CLI and runtime for building React apps with fast iteration.",
   "license": "MIT",
   "author": "Venkatesh Sundaram",