如何搭建 JavaScript 应用程序

my-app/
├── src # all project code lies within here
│   ├── utils # optional utilities for your graph
│   │   ├── tools.ts # tools for your graph
│   │   ├── nodes.ts # node functions for your graph
│   │   └── state.ts # state definition of your graph
│   └── agent.ts # code for constructing your graph
├── package.json # package dependencies
├── .env # environment variables
└── langgraph.json # configuration file for LangGraph

{
  "name": "langgraphjs-studio-starter",
  "packageManager": "yarn@1.22.22",
  "dependencies": {
    "@langchain/core": "^0.2.31",
    "@langchain/langgraph": "^0.2.0",
    "@langchain/openai": "^0.2.8",
    "@langchain/tavily": "^0.1.5"
  }
}

"@langchain/core": "^0.3.42",
"@langchain/langgraph": "^0.2.57",
"@langchain/langgraph-checkpoint": "~0.0.16",

my-app/
└── package.json # package dependencies

MY_ENV_VAR_1=foo
MY_ENV_VAR_2=bar
OPENAI_API_KEY=key
TAVILY_API_KEY=key_2

my-app/
├── package.json
└── .env # environment variables

import type { AIMessage } from "@langchain/core/messages";
import { TavilySearch } from "@langchain/tavily";
import { ChatOpenAI } from "@langchain/openai";

import { MessagesAnnotation, StateGraph } from "@langchain/langgraph";
import { ToolNode } from "@langchain/langgraph/prebuilt";

const tools = [new TavilySearch({ maxResults: 3 })];

// 定义调用模型的函数
async function callModel(state: typeof MessagesAnnotation.State) {
  /**
   * 调用为我们智能体提供动力的大语言模型。
   * 欢迎自定义提示词、模型和其他逻辑！
   */
  const model = new ChatOpenAI({
    model: "gpt-5.5",
  }).bindTools(tools);

  const response = await model.invoke([
    {
      role: "system",
      content: `You are a helpful assistant. The current date is ${new Date().getTime()}.`,
    },
    ...state.messages,
  ]);

  // MessagesAnnotation 支持返回单个消息或消息数组
  return { messages: response };
}

// 定义决定是否继续的函数
function routeModelOutput(state: typeof MessagesAnnotation.State) {
  const messages = state.messages;
  const lastMessage: AIMessage = messages[messages.length - 1];
  // 如果大语言模型正在调用工具，则路由到那里。
  if ((lastMessage?.tool_calls?.length ?? 0) > 0) {
    return "tools";
  }
  // 否则，结束图。
  return "__end__";
}

// 定义一个新图。
// 有关定义自定义图状态的更多信息，请参见 https://langchain-ai.github.io/langgraphjs/how-tos/define-state/#getting-started。
const workflow = new StateGraph(MessagesAnnotation)
  // 定义我们将在其中循环的两个节点
  .addNode("callModel", callModel)
  .addNode("tools", new ToolNode(tools))
  // 设置入口点为 `callModel`
  // 这意味着这个节点是第一个被调用的
  .addEdge("__start__", "callModel")
  .addConditionalEdges(
    // 首先，我们定义边的源节点。我们使用 `callModel`。
    // 这意味着这些是 `callModel` 节点被调用后采取的边。
    "callModel",
    // 接下来，我们传入一个函数，该函数将决定在源节点被调用后调用哪个目标节点。
    routeModelOutput,
    // 条件边可以路由到的可能目的地列表。
    // 这是 Studio 正确渲染图所必需的
    ["tools", "__end__"]
  )
  // 这意味着在 `tools` 被调用后，接下来会调用 `callModel` 节点。
  .addEdge("tools", "callModel");

// 最后，我们编译它！
// 这会将其编译成一个您可以调用和部署的图。
export const graph = workflow.compile();

my-app/
├── src # all project code lies within here
│   ├── utils # optional utilities for your graph
│   │   ├── tools.ts # tools for your graph
│   │   ├── nodes.ts # node functions for your graph
│   │   └── state.ts # state definition of your graph
│   └── agent.ts # code for constructing your graph
├── package.json # package dependencies
├── .env # environment variables
└── langgraph.json # configuration file for LangGraph

{
  "node_version": "20",
  "dockerfile_lines": [],
  "dependencies": ["."],
  "graphs": {
    "agent": "./src/agent.ts:graph"
  },
  "env": ".env"
}