@zhin.js/console 1.0.7 → 1.0.9

package/app/index.ts

@@ -1,12 +1,12 @@
-import { register, useContext, useApp } from "@zhin.js/core";
-import react from "@vitejs/plugin-react";
-import WebSocket, { WebSocketServer } from "ws";
-import { createServer, ViteDevServer, searchForWorkspaceRoot } from "vite";
+import { register, useContext,useLogger } from "@zhin.js/core";
+import  { WebSocketServer } from "ws";
+import { ViteDevServer } from "vite";
+import mime from "mime";
 import connect from "koa-connect";
 import * as fs from "fs";
 import * as path from "path";
-import { fileURLToPath } from "node:url";
-import tailwindcss from "@tailwindcss/vite";
+import { createViteDevServer } from "./dev.js";
+import { setupWebSocket,notifyDataUpdate } from "./websocket.js";
 
 declare module "@zhin.js/types" {
   interface GlobalContext {
@@ -20,11 +20,12 @@ export type WebEntry =
       development: string;
     };
 export type WebServer = {
-  vite: ViteDevServer;
+  vite?: ViteDevServer;
   addEntry(entry: WebEntry): () => void;
   entries: Record<string, string>;
   ws: WebSocketServer;
 };
+const logger=useLogger()
 const createSyncMsg = (key: string, value: any) => {
   return {
     type: "sync",
@@ -53,90 +54,9 @@ const createDeleteMsg = (key: string, value: any) => {
   };
 };
 useContext("router", async (router) => {
-  const root = path.join(import.meta.dirname, "../client");
   const base = "/vite/";
 
-  const vite = await createServer({
-    root,
-    base,
-    plugins: [react(), tailwindcss()],
-    server: {
-      middlewareMode: true,
-      fs: {
-        strict: false,
-      },
-    },
-    resolve: {
-      dedupe: [
-        "react",
-        "react-dom",
-        "clsx",
-        "tailwind-merge",
-        "@reduxjs/toolkit",
-        "react-router",
-        "react-redux",
-        "redux-persist",
-      ],
-      alias: {
-        "@zhin.js/client": path.resolve(root, "../../client/client"),
-        "@": path.resolve(root, "../client/src"),
-      },
-    },
-    optimizeDeps: {
-      include: ["react", "react-dom"],
-    },
-    build: {
-      rollupOptions: {
-        input: root + "/index.html",
-      },
-    },
-  });
-
-  // Vite 中间件 - 必须在其他路由之前
-  router.use((ctx: any, next: any) => {
-    if (ctx.request.originalUrl.startsWith("/api")) return next();
-    return connect(vite.middlewares)(ctx, next);
-  });
-
-  // SPA 回退路由 - 处理所有未匹配的路由
-  router.all("*all", async (ctx, next) => {
-    const url = ctx.request.originalUrl.replace(base, "");
-    const name = ctx.path.slice(1);
-
-    const sendFile = (filename: string) => {
-      ctx.type = path.extname(filename);
-      if (filename.endsWith(".ts")) ctx.type = "text/javascript";
-      return (ctx.body = fs.createReadStream(filename));
-    };
-
-    // 1. 检查是否是动态入口
-    if (Object.keys(webServer.entries).includes(name)) {
-      return sendFile(path.resolve(process.cwd(), webServer.entries[name]));
-    }
-
-    // 2. 检查是否是静态文件
-    const filename = path.resolve(root, name);
-    if (filename.startsWith(root) || filename.includes("node_modules")) {
-      if (fs.existsSync(filename)) {
-        const fileState = fs.statSync(filename);
-        if (fileState.isFile()) {
-          return sendFile(filename);
-        }
-      }
-    } else {
-      // 安全检查：路径不在允许范围内
-      return (ctx.status = 403);
-    }
-
-    // 3. 所有其他路径（包括 SPA 路由）都返回 index.html
-    // 这样前端路由可以正确处理
-    const template = fs.readFileSync(path.resolve(root, "index.html"), "utf8");
-    ctx.type = "html";
-    ctx.body = await vite.transformIndexHtml(url, template);
-  });
-
   const webServer: WebServer = {
-    vite,
     entries: {},
     addEntry(entry) {
       const hash =
@@ -148,7 +68,7 @@ useContext("router", async (router) => {
               (process.env.NODE_ENV as "development" | "production") ||
                 "development"
             ];
-      this.entries[hash] = `/vite/@fs/${entryFile}`;
+      this.entries[hash] = `/vite/@fs/${entryFile}`
       for (const ws of this.ws.clients || []) {
         ws.send(JSON.stringify(createAddMsg("entries", this.entries[hash])));
       }
@@ -163,244 +83,98 @@ useContext("router", async (router) => {
     },
     ws: router.ws("/server"),
   };
-  // 数据推送函数
-  const broadcastToAll = (message: any) => {
-    for (const ws of webServer.ws.clients || []) {
-      if (ws.readyState === WebSocket.OPEN) {
-        ws.send(JSON.stringify(message));
-      }
-    }
-  };
-
-  // 推送数据更新通知
-  const notifyDataUpdate = () => {
-    broadcastToAll({
-      type: "data-update",
-      timestamp: Date.now(),
+  const isDev = process.env.NODE_ENV === "development";
+  const root = isDev
+    ? path.join(import.meta.dirname, "../client")
+    : path.join(import.meta.dirname, "../dist");
+  logger.info({isDev,root})
+  if (isDev) {
+    webServer.vite = await await createViteDevServer({
+      root,
+      base,
+      enableTailwind: true,
     });
-  };
-
-  // WebSocket 连接处理
-  webServer.ws.on("connection", (ws: WebSocket) => {
-    // 发送初始数据
-    ws.send(
-      JSON.stringify(
-        createSyncMsg(
-          "entries",
-          Array.from(new Set(Object.values(webServer.entries)))
-        )
-      )
-    );
-
-    // 通知客户端进行数据初始化
-    ws.send(
-      JSON.stringify({
-        type: "init-data",
-        timestamp: Date.now(),
-      })
-    );
+    // Vite 中间件 - 必须在其他路由之前
+    router.use((ctx, next) => {
+      if (ctx.request.originalUrl.startsWith("/api")) return next();
+      return connect(webServer.vite!.middlewares)(ctx, next);
+    });
+  }else{
+    router.use((ctx, next) => {
+      if (ctx.request.originalUrl.startsWith("/api")) return next();
+      if(!ctx.path.startsWith('/vite/@fs/')) return next();
+      const filename=ctx.path.replace(`/vite/@fs/`,'')
+      if(!fs.existsSync(filename)) return next();
+      ctx.type = mime.getType(filename) || path.extname(filename);
+      ctx.body = fs.createReadStream(filename);
+    });
+  }
 
-    // 处理 WebSocket 消息
-    ws.on("message", async (data) => {
+  // SPA 回退路由 - 处理所有未匹配的路由
+  router.all("*all", async (ctx, next) => {
+    const url = ctx.request.originalUrl.replace(base, "");
+    const name = isDev ? ctx.path.slice(1) : ctx.path.slice(1);
+    const sendFile = (filename: string) => {
+      console.log(`发送文件: ${filename}`);
+      // 安全检查：确保是常规文件
       try {
-        const message = JSON.parse(data.toString());
-        const { type, pluginName, requestId } = message;
-
-        // 获取应用实例
-        const app = useApp();
-
-        switch (type) {
-          case "config:get":
-            try {
-              let config;
-              if (pluginName === "app") {
-                config = app.getConfig();
-              } else {
-                const plugin = app.findPluginByName(pluginName);
-                if (!plugin) {
-                  throw new Error(`Plugin ${pluginName} not found`);
-                }
-                config = plugin.config;
-              }
-
-              ws.send(
-                JSON.stringify({
-                  requestId,
-                  data: config,
-                })
-              );
-            } catch (error) {
-              ws.send(
-                JSON.stringify({
-                  requestId,
-                  error: (error as Error).message,
-                })
-              );
-            }
-            break;
-
-          case "config:set":
-            try {
-              const { data: newConfig } = message;
-
-              if (pluginName === "app") {
-                app.config = newConfig;
-              } else {
-                const plugin = app.findPluginByName(pluginName);
-                if (!plugin) {
-                  throw new Error(`Plugin ${pluginName} not found`);
-                }
-                plugin.config = newConfig;
-              }
-
-              // 响应成功
-              ws.send(
-                JSON.stringify({
-                  requestId,
-                  data: "success",
-                })
-              );
-
-              // 广播配置更新
-              webServer.ws.clients.forEach((client) => {
-                if (client.readyState === 1) {
-                  // WebSocket.OPEN
-                  client.send(
-                    JSON.stringify({
-                      type: "config:updated",
-                      pluginName,
-                      data: newConfig,
-                    })
-                  );
-                }
-              });
-            } catch (error) {
-              ws.send(
-                JSON.stringify({
-                  requestId,
-                  error: (error as Error).message,
-                })
-              );
-            }
-            break;
-
-          case "schema:get":
-            try {
-              let schema;
-              if (pluginName === "app") {
-                schema = app.schema?.toJSON();
-              } else {
-                const plugin = app.findPluginByName(pluginName);
-                if (!plugin) {
-                  throw new Error(`Plugin ${pluginName} not found`);
-                }
-                schema = plugin.schema?.toJSON();
-              }
-
-              ws.send(
-                JSON.stringify({
-                  requestId,
-                  data: schema,
-                })
-              );
-            } catch (error) {
-              ws.send(
-                JSON.stringify({
-                  requestId,
-                  error: (error as Error).message,
-                })
-              );
-            }
-            break;
-
-          case "config:get-all":
-            try {
-              const configs: Record<string, any> = {};
-
-              // 获取 App 配置
-              configs["app"] = app.getConfig();
-
-              // 获取所有插件配置
-              for (const plugin of app.dependencyList) {
-                if (plugin.config && Object.keys(plugin.config).length > 0) {
-                  configs[plugin.name] = plugin.config;
-                }
-              }
-
-              ws.send(
-                JSON.stringify({
-                  requestId,
-                  data: configs,
-                })
-              );
-            } catch (error) {
-              ws.send(
-                JSON.stringify({
-                  requestId,
-                  error: (error as Error).message,
-                })
-              );
-            }
-            break;
-
-          case "schema:get-all":
-            try {
-              const schemas: Record<string, any> = {};
-
-              // 获取 App Schema
-              const appSchema = app.schema?.toJSON();
-              if (appSchema) {
-                schemas["app"] = appSchema;
-              }
-
-              // 获取所有插件 Schema
-              for (const plugin of app.dependencyList) {
-                const schema = plugin.schema?.toJSON();
-                if (schema) {
-                  schemas[plugin.name] = schema;
-                }
-              }
+        const stat = fs.statSync(filename);
+        if (!stat.isFile()) {
+          ctx.status = 404;
+          return;
+        }
+      } catch (error) {
+        ctx.status = 404;
+        return;
+      }
 
-              ws.send(
-                JSON.stringify({
-                  requestId,
-                  data: schemas,
-                })
-              );
-            } catch (error) {
-              ws.send(
-                JSON.stringify({
-                  requestId,
-                  error: (error as Error).message,
-                })
-              );
-            }
-            break;
+      ctx.type = path.extname(filename);
+      ctx.type = mime.getType(filename) || ctx.type;
+      return (ctx.body = fs.createReadStream(filename));
+    };
+    
+    // 1. 检查是否是动态入口
+    if (Object.keys(webServer.entries).includes(name)) {
+      return sendFile(path.resolve(process.cwd(), webServer.entries[name]));
+    }
 
-          // 其他消息类型保持不变，让 console 插件自己处理
+    // 2. 检查是否是静态文件
+    const filename = path.resolve(root, name);
+    if (filename.startsWith(root) || filename.includes("node_modules")) {
+      try {
+        if (fs.existsSync(filename)) {
+          const fileState = fs.statSync(filename);
+          // 只处理常规文件，忽略目录、socket、符号链接等
+          if (
+            fileState.isFile() &&
+            !fileState.isSocket() &&
+            !fileState.isFIFO()
+          ) {
+            return sendFile(filename);
+          }
         }
       } catch (error) {
-        console.error("WebSocket 消息处理错误:", error);
-        ws.send(
-          JSON.stringify({
-            error: "Invalid message format",
-          })
-        );
+        // 忽略文件系统错误，继续处理
+        console.warn(`文件访问错误: ${filename}`, (error as Error).message);
       }
-    });
-
-    ws.on("close", () => {});
+    } else {
+      // 安全检查：路径不在允许范围内
+      return (ctx.status = 403);
+    }
 
-    ws.on("error", (error) => {
-      // console.error 已替换为注释
-    });
+    // 3. 所有其他路径（包括 SPA 路由）都返回 index.html
+    // 这样前端路由可以正确处理
+    const indexFile = path.resolve(root, "index.html");
+    if(!isDev) return sendFile(indexFile);
+    const template = fs.readFileSync(indexFile, "utf8");
+    ctx.type = "html";
+    ctx.body = await webServer.vite!.transformIndexHtml(url, template);
   });
-
   // 定时通知客户端更新数据
   const dataUpdateInterval = setInterval(() => {
-    notifyDataUpdate();
+    notifyDataUpdate(webServer);
   }, 5000); // 每5秒通知一次更新
-
+  setupWebSocket(webServer);
   // 插件卸载时清理定时器
   process.on("exit", () => {
     clearInterval(dataUpdateInterval);
@@ -412,7 +186,7 @@ useContext("router", async (router) => {
       return webServer;
     },
     async dispose(server) {
-      await server.vite.close();
+      await server.vite?.close();
       server.ws.close();
     },
   });

package/app/websocket.ts

@@ -0,0 +1,109 @@
+import WebSocket from "ws";
+import type { WebServer } from "./index.js";
+
+/**
+ * 设置 WebSocket 连接处理
+ */
+export function setupWebSocket(webServer: WebServer) {
+  webServer.ws.on("connection", (ws: WebSocket) => {
+    // 发送初始数据同步
+    ws.send(
+      JSON.stringify({
+        type: "sync",
+        data: {
+          key: "entries",
+          value: Object.values(webServer.entries),
+        },
+      })
+    );
+
+    // 通知客户端进行数据初始化
+    ws.send(
+      JSON.stringify({
+        type: "init-data",
+        timestamp: Date.now(),
+      })
+    );
+
+    // 处理客户端消息
+    ws.on("message", async (data) => {
+      try {
+        const message = JSON.parse(data.toString());
+        await handleWebSocketMessage(ws, message, webServer);
+      } catch (error) {
+        console.error("WebSocket 消息处理错误:", error);
+        ws.send(
+          JSON.stringify({
+            error: "Invalid message format",
+          })
+        );
+      }
+    });
+
+    ws.on("close", () => {
+      // 连接关闭时的清理工作
+    });
+
+    ws.on("error", (error) => {
+      console.error("WebSocket 错误:", error);
+    });
+  });
+}
+
+/**
+ * 处理 WebSocket 消息
+ */
+async function handleWebSocketMessage(
+  ws: WebSocket,
+  message: any,
+  webServer: WebServer
+) {
+  const { type, requestId } = message;
+
+  switch (type) {
+    case "ping":
+      // 心跳检测
+      ws.send(JSON.stringify({ type: "pong", requestId }));
+      break;
+
+    case "entries:get":
+      // 获取所有入口文件
+      ws.send(
+        JSON.stringify({
+          requestId,
+          data: Object.values(webServer.entries),
+        })
+      );
+      break;
+
+    default:
+      // 未知消息类型
+      ws.send(
+        JSON.stringify({
+          requestId,
+          error: `Unknown message type: ${type}`,
+        })
+      );
+  }
+}
+
+/**
+ * 广播消息给所有连接的客户端
+ */
+export function broadcastToAll(webServer: WebServer, message: any) {
+  for (const ws of webServer.ws.clients || []) {
+    if (ws.readyState === WebSocket.OPEN) {
+      ws.send(JSON.stringify(message));
+    }
+  }
+}
+
+/**
+ * 通知数据更新
+ */
+export function notifyDataUpdate(webServer: WebServer) {
+  broadcastToAll(webServer, {
+    type: "data-update",
+    timestamp: Date.now(),
+  });
+}

package/client/public/vendor/react-dom.production.min.js

@@ -0,0 +1 @@
+Not found: /react-dom@19.2.0/umd/react-dom.production.min.js

package/client/public/vendor/react.production.min.js

@@ -0,0 +1 @@
+Not found: /react@19.2.0/umd/react.production.min.js

package/client/tailwind.config.js

@@ -1,12 +1,27 @@
 /** @type {import('tailwindcss').Config} */
+import path from 'path';
 const cwd = process.cwd();
+
+// 安全的路径构建函数，避免扫描特殊文件
+const safePath = (...parts) => {
+  try {
+    return path.resolve(...parts);
+  } catch (error) {
+    console.warn(`Tailwind 路径构建失败: ${parts.join('/')}`, error.message);
+    return '';
+  }
+};
+
 export default {
     content: [
         "./index.html",
         './src/**/*.{js,ts,jsx,tsx,mdx}',
-        `${cwd}/**/radix-ui/**/*.{js,ts,jsx,tsx}`,
-        `${cwd}/**/@radix-ui/themes/**/*.{js,ts,jsx,tsx}`,
-    ],
+        './node_modules/@radix-ui/**/*.{js,ts,jsx,tsx}',
+        `${cwd}/node_modules/@zhin.js/*/client/**/*.{js,ts,jsx,tsx}`,
+        `${cwd}/node_modules/@zhin.js/*/dist/**/*.{js,ts,jsx,tsx}`,
+        `${cwd}/plugins/*/client/**/*.{js,ts,jsx,tsx}`,
+        `${cwd}/client/**/*.{js,ts,jsx,tsx}`,
+    ].filter(Boolean), // 过滤掉空字符串
     theme: {
         extend: {
             colors: {

package/lib/bin.d.ts

@@ -0,0 +1,3 @@
+#!/usr/bin/env node
+export {};
+//# sourceMappingURL=bin.d.ts.map

package/lib/bin.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"bin.d.ts","sourceRoot":"","sources":["../app/bin.ts"],"names":[],"mappings":""}

package/lib/bin.js

@@ -0,0 +1,45 @@
+#!/usr/bin/env node
+import { buildCurrentPlugin, buildConsoleClient } from "./build.js";
+import path from "path";
+import { fileURLToPath } from "url";
+const args = process.argv.slice(2);
+const command = args[0];
+async function main() {
+    try {
+        switch (command) {
+            case "build":
+                // 构建当前目录的插件客户端代码
+                console.log("🔨 Building plugin client...");
+                await buildCurrentPlugin();
+                break;
+            case "build:console":
+                // 构建 console 插件的客户端代码
+                console.log("🔨 Building console client...");
+                const consoleRoot = path.resolve(path.dirname(fileURLToPath(import.meta.url)), "..");
+                await buildConsoleClient({ consoleRoot });
+                break;
+            default:
+                console.log(`
+Zhin.js Client Builder
+
+Usage:
+  zhin-client build          Build current plugin's client code
+  zhin-client build:console  Build console plugin's client code (SPA mode)
+
+Examples:
+  # Build a plugin (single file mode)
+  cd my-plugin && zhin-client build
+
+  # Build console (SPA mode)
+  zhin-client build:console
+        `);
+                process.exit(1);
+        }
+    }
+    catch (error) {
+        console.error("❌ Build failed:", error);
+        process.exit(1);
+    }
+}
+main();
+//# sourceMappingURL=bin.js.map

package/lib/bin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bin.js","sourceRoot":"","sources":["../app/bin.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AACpE,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,aAAa,EAAE,MAAM,KAAK,CAAC;AAEpC,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;AACnC,MAAM,OAAO,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC;AAExB,KAAK,UAAU,IAAI;IACjB,IAAI,CAAC;QACH,QAAQ,OAAO,EAAE,CAAC;YAChB,KAAK,OAAO;gBACV,iBAAiB;gBACjB,OAAO,CAAC,GAAG,CAAC,8BAA8B,CAAC,CAAC;gBAC5C,MAAM,kBAAkB,EAAE,CAAC;gBAC3B,MAAM;YAER,KAAK,eAAe;gBAClB,sBAAsB;gBACtB,OAAO,CAAC,GAAG,CAAC,+BAA+B,CAAC,CAAC;gBAC7C,MAAM,WAAW,GAAG,IAAI,CAAC,OAAO,CAC9B,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAC5C,IAAI,CACL,CAAC;gBACF,MAAM,kBAAkB,CAAC,EAAE,WAAW,EAAE,CAAC,CAAC;gBAC1C,MAAM;YAER;gBACE,OAAO,CAAC,GAAG,CAAC;;;;;;;;;;;;;SAaX,CAAC,CAAC;gBACH,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QACpB,CAAC;IACH,CAAC;IAAC,OAAO,KAAK,EAAE,CAAC;QACf,OAAO,CAAC,KAAK,CAAC,iBAAiB,EAAE,KAAK,CAAC,CAAC;QACxC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IAClB,CAAC;AACH,CAAC;AAED,IAAI,EAAE,CAAC"}