@langgraph-js/ui 4.0.1 → 4.0.3

package/cli.mjs

@@ -18,9 +18,11 @@ console.log("启动 LangGraph UI...");
 console.log(`命令: vite preview ${args.join(" ")}`);
 
 // 使用 spawn 而不是 exec，以便更好地处理输入/输出流和参数
-const childProcess = spawn("npx", ["vite", "preview", ...args], {
+const childProcess = spawn("npx", ["vite", "dev", "--config", "../vite.config.preview.ts", ...args], {
     stdio: "inherit", // 继承父进程的 stdio，使输出直接显示在控制台
     shell: true,
+    // cwd 是 ./dist
+    cwd: "./dist",
 });
 
 // 处理子进程退出

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@langgraph-js/ui",
-  "version": "4.0.1",
+  "version": "4.0.3",
   "description": "",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",

package/src/OpenSmithPlugin.ts

@@ -0,0 +1,39 @@
+import { Plugin } from "vite";
+import { Readable } from "stream";
+import { app } from "@langgraph-js/open-smith/dist/app.js";
+export const OpenSmithPlugin = () =>
+    ({
+        name: "open-smith",
+        configureServer(server) {
+            console.log("open-smith is open on http://localhost:4173/api/open-smith/ui/index.html");
+            server.middlewares.use("/api/open-smith", async (req, res, next) => {
+                try {
+                    const body = Readable.toWeb(req);
+                    // Build a compatible Request for Fetch API
+                    const url = `http://localhost${req.url}`;
+                    const fetchRequest = new Request(url, {
+                        method: req.method,
+                        headers: req.headers as any,
+                        body: req.method && !["GET", "HEAD"].includes(req.method.toUpperCase()) && body ? (body as any) : undefined,
+                        ...(req.method && !["GET", "HEAD"].includes(req.method.toUpperCase()) && body ? { duplex: "half" as const } : {}),
+                    });
+
+                    // Proxy the request to app.basePath handler
+                    const response = await app.basePath("/api/open-smith").fetch(fetchRequest);
+
+                    // Set status and headers
+                    res.statusCode = response.status;
+                    // @ts-ignore
+                    for (const [key, value] of response.headers.entries()) {
+                        res.setHeader(key, value);
+                    }
+
+                    // Send the response body
+                    const arrayBuffer = await response.arrayBuffer();
+                    res.end(Buffer.from(arrayBuffer));
+                } catch (error) {
+                    console.log(error);
+                }
+            });
+        },
+    }) as Plugin;

package/tsconfig.node.json

@@ -5,5 +5,5 @@
         "moduleResolution": "bundler",
         "allowSyntheticDefaultImports": true
     },
-    "include": ["vite.config.ts"]
+    "include": ["vite.config.ts", "src/OpenSmithPlugin.ts"]
 }

package/vite.config.preview.ts

@@ -0,0 +1,35 @@
+import { defineConfig, Plugin } from "vite";
+import basicSsl from "@vitejs/plugin-basic-ssl";
+import { OpenSmithPlugin } from "./src/OpenSmithPlugin";
+
+// https://vitejs.dev/config/
+export default defineConfig(({ mode }) => {
+    const isHttps = mode === "https";
+    return {
+        plugins: [isHttps ? basicSsl() : undefined, OpenSmithPlugin()],
+        resolve: {
+            alias: {
+                "@langgraph-js/sdk": new URL("../langgraph-client/src", import.meta.url).pathname,
+                "@/": new URL("./src/", import.meta.url).pathname,
+            },
+        },
+        optimizeDeps: {
+            exclude: ["@langgraph-js/ui", "@langgraph-js/sdk"],
+        },
+        server: {
+            proxy: {
+                "/api/langgraph": {
+                    target: "http://localhost:8123",
+                    changeOrigin: true,
+                    rewrite: (path) => path.replace(/^\/api\/langgraph/, ""),
+                },
+            },
+            // headers: {
+            //     "Cross-Origin-Opener-Policy": "same-origin",
+            //     "Cross-Origin-Embedder-Policy": "require-corp",
+            //     "cross-origin-resource-policy": "cross-origin",
+            // },
+            port: 1111,
+        },
+    };
+});

package/vite.config.ts

@@ -2,49 +2,12 @@ import react from "@vitejs/plugin-react";
 import { defineConfig, Plugin } from "vite";
 import basicSsl from "@vitejs/plugin-basic-ssl";
 import tailwindcss from "@tailwindcss/vite";
-import { Readable } from "stream";
-const OpenSmithPlugin = () =>
-    ({
-        name: "open-smith",
-        configureServer(server) {
-            server.middlewares.use("/api/open-smith", async (req, res, next) => {
-                const { app } = await import("@langgraph-js/open-smith/dist/app.js");
-                try {
-                    const body = Readable.toWeb(req);
-                    // Build a compatible Request for Fetch API
-                    const url = `http://localhost${req.url}`;
-                    const fetchRequest = new Request(url, {
-                        method: req.method,
-                        headers: req.headers as any,
-                        body: req.method && !["GET", "HEAD"].includes(req.method.toUpperCase()) && body ? body : undefined,
-                        ...(req.method && !["GET", "HEAD"].includes(req.method.toUpperCase()) && body ? { duplex: "half" as const } : {}),
-                    });
-
-                    // Proxy the request to app.basePath handler
-                    const response = await app.basePath("/api/open-smith").fetch(fetchRequest);
-
-                    // Set status and headers
-                    res.statusCode = response.status;
-                    // @ts-ignore
-                    for (const [key, value] of response.headers.entries()) {
-                        res.setHeader(key, value);
-                    }
-
-                    // Send the response body
-                    const arrayBuffer = await response.arrayBuffer();
-                    res.end(Buffer.from(arrayBuffer));
-                } catch (error) {
-                    console.log(error);
-                }
-            });
-        },
-    }) as Plugin;
 
 // https://vitejs.dev/config/
-export default defineConfig(({ mode }) => {
+export default defineConfig(({ mode, command }) => {
     const isHttps = mode === "https";
     return {
-        plugins: [react(), tailwindcss(), isHttps ? basicSsl() : undefined, process.env.NODE_ENV === "development" && OpenSmithPlugin()],
+        plugins: [react(), tailwindcss(), isHttps ? basicSsl() : undefined],
         resolve: {
             alias: {
                 "@langgraph-js/sdk": new URL("../langgraph-client/src", import.meta.url).pathname,