DB

dend/brick-mcp-app

开发工具

本页由 AI 翻译,技术细节请以原文为准。 查看原文

28 stars 6 forks 质量 70 趋势 11MIT

🧱 实现我砌砖梦想的MCP应用

概览

Brick Builder MCP 应用 一个用于在支持 MCP 的主机(如 Claude Desktop 和 Visual Studio Code)中设计三维积木结构的 Three.js MCP 应用。可以交互式构建,或者让 AI 通过自然语言为你构建结构。快速入门 ·连接 ·工具 ·可扩展性 Claude 运行的 Brick Builder,通过自然语言构建结构 服务器是所有场景的状态。人工智能(LLM)和交互式界面均通过MCP工具完全变异状态。服务器验证每一项操作——碰撞检测、边界检查、支持验证——并返回权威结果。 - : 主机为LLM和应用iframe创建独立的MCP会话。场景状态存储在模块级,因此两个会话读写同一个场景。- : UI每秒轮询一次brick_get_scene,捕捉LLM发起的变更。用户发起的变更(通过callServerTool)会即时反映。

概述(AI 翻译)

Brick Builder MCP 应用

一款Three.js MCP应用,用于在支持MCP的主机(如Claude Desktop和Visual Studio Code)中设计3D砖块结构。可以交互式构建,或者让AI通过自然语言为你构建结构。

快速入门 · 连接 · 工具 · 可扩展性

Claude 运行的 Brick Builder,通过自然语言构建结构

快速启动

服务器起始于 http://localhost:3001/mcp.

先决条件

  • Node.js 20+
  • NPM 10+

命令

指挥 描述
npm install 安装依赖
npm run build 构建客户端(Vite)+ 服务器(esbuild)
npm run serve 启动服务器,进入开发者模式(TSX,自动加载)
npm run dev 看客户端 + 同时发球
npm start 构建然后服务(一个命令)

建筑

服务器是所有场景状态的唯一真实来源。人工智能(LLM)和交互式界面均通过MCP工具完全变异状态。服务器验证每一项操作——碰撞检测、边界检查、支持验证——并返回权威结果。

关键设计决策

本页由 AI 翻译,技术细节请以原文为准。

README

以下为原文 README 节选,完整内容请查看原文。

Brick Builder running in Claude, building a structure through natural language

Quick Start

git clone https://github.com//brick-mcp-app.git
cd brick-mcp-app
npm install
npm run build
npm run serve

The server starts at http://localhost:3001/mcp.

Prerequisites

  • Node.js 20+
  • npm 10+

Commands

Command Description
npm install Install dependencies
npm run build Build client (Vite) + server (esbuild)
npm run serve Start server in dev mode (tsx, auto-reload)
npm run dev Watch client + serve concurrently
npm start Build then serve (one command)

Architecture

The server is the single source of truth for all scene state. Both the AI (LLM) and the interactive UI mutate state exclusively through MCP tools. The server validates every operation — collision detection, bounds checking, support verification — and returns authoritative results.

Key Design Decisions

  • Shared module-level state: The host creates separate MCP sessions for the LLM and the app iframe. Scene state lives at module level so both sessions read/write the same scene.
  • Polling for cross-session sync: The UI polls brick_get_scene every second to pick up LLM-initiated changes. User-initiated changes (via callServerTool) are reflected instantly.
  • Single-brick placement: The LLM places one brick per brick_place call and receives the placed brick’s footprint in the response, enabling precise positioning of subsequent bricks.

Connecting to Hosts

[!TIP] You can use Cloudflare Tunnels to expose your locally-hosted server to the internet. This lets you connect from claude.ai or any remote MCP host without port forwarding or VPNs:

在 GitHub 查看完整 README

安装

This server does not publish a one-line install command.

Open the repository installation guide 新手?先看 mcpskill.org 教程 →