告别AI瞎编API！GitMCP实战：Web‑CAD开发准确率拉满

文章目录

- 前言
- [1. 救星来了：GitMCP到底是个啥](#1. 救星来了：GitMCP到底是个啥)
- [2. 为啥CAD项目用这个，效果直接拉满](#2. 为啥CAD项目用这个，效果直接拉满)
- [3. 三个现成的CAD项目MCP服务，拿过去就能用](#3. 三个现成的CAD项目MCP服务，拿过去就能用)
- - [3.1 realdwg‑web](#3.1 realdwg‑web)
  - [3.2 cad‑viewer](#3.2 cad‑viewer)
  - [3.3 mtext‑renderer](#3.3 mtext‑renderer)
- [4. 各个工具配置教程，手把手教你踩对坑](#4. 各个工具配置教程，手把手教你踩对坑)
- - [4.1 Cursor](#4.1 Cursor)
  - [4.2 Windsurf](#4.2 Windsurf)
  - [4.3 VS Code](#4.3 VS Code)
  - [4.4 Claude Desktop](#4.4 Claude Desktop)
  - [4.5 Cline](#4.5 Cline)
- [5. 配置完就完事了？大错特错](#5. 配置完就完事了？大错特错)
- [6. 三个实用提问模板，直接抄作业](#6. 三个实用提问模板，直接抄作业)
- - [6.1 CAD Viewer 组件场景](#6.1 CAD Viewer 组件场景)
  - [6.2 底层DWG解析场景](#6.2 底层DWG解析场景)
  - [6.3 MText 渲染选型场景](#6.3 MText 渲染选型场景)
- [7. 多个MCP一起用，打通全链路](#7. 多个MCP一起用，打通全链路)
- [8. 我最推荐的三步工作流](#8. 我最推荐的三步工作流)
- - [8.1 第一步：先读文档，再写代码](#8.1 第一步：先读文档，再写代码)
  - [8.2 第二步：先要最小实现](#8.2 第二步：先要最小实现)
  - [8.3 第三步：对着文档自查](#8.3 第三步：对着文档自查)
- [9. 搭配本地源码，效果直接翻倍](#9. 搭配本地源码，效果直接翻倍)
- [10. 别把MCP当万能神药](#10. 别把MCP当万能神药)
- [11. 常见踩坑快速解答](#11. 常见踩坑快速解答)
- - [11.1 配置完MCP服务不显示？](#11.1 配置完MCP服务不显示？)
  - [11.2 AI死活不用MCP？](#11.2 AI死活不用MCP？)
  - [11.3 生成的代码还是老版本？](#11.3 生成的代码还是老版本？)
- [12. 最后说两句](#12. 最后说两句)

P.S. 目前国内还是很缺AI人才的，希望更多人能真正加入到AI行业，共同促进行业进步，增强我国的AI竞争力。想要系统学习AI知识的朋友可以看看我精心打磨的教程 http://blog.csdn.net/jiangjunshow，教程通俗易懂，高中生都能看懂，还有各种段子风趣幽默，从深度学习基础原理到各领域实战应用都有讲解，我22年的AI积累全在里面了。注意，教程仅限真正想入门AI的朋友，否则看看零散的博文就够了。

前言

不知道你们有没有让AI写过CAD相关的前端代码？

我反正之前每次都像开盲盒。

你让它写个DWG加载功能，它噼里啪啦输出几十行，看起来有模有样，变量名起得比你还规范。

一跑起来，报错能绕你编辑器三圈。

为啥？API全是它脑补的，要么版本老到能进博物馆，要么压根就没这个方法。

合着AI写代码全靠"我觉得有这个API"，调试的锅全是我们背。

1. 救星来了：GitMCP到底是个啥

简单说，这东西就是个中间桥梁。

一边连着GitHub仓库里的所有文档、代码，一边连着你的AI编程助手。

不用你自己搭服务器，不用你手动把文档复制粘贴给AI。

规则简单到离谱：只要GitHub仓库地址是 https://github.com/所有者/项目名，对应的GitMCP地址就是 https://gitmcp.io/所有者/项目名。

就换个域名的事，AI就能直接读取整个仓库的官方文档和真实代码。

再也不用它靠几年前的训练数据瞎猜了。

2. 为啥CAD项目用这个，效果直接拉满

说句实在的，普通前端项目，AI瞎猜还能蒙对个七八分。

CAD项目？那直接是地狱难度。

什么DWG/DXF解析、CAD数据模型、Three.js渲染管线、Web Worker、SHX字体加载，还有一堆Vue组件封装。

领域专有API多到你背不完，AI那点通用训练数据，根本不够打。

就像你让一个只会做家常菜的厨师，直接去做满汉全席，它不翻车才怪。

就拿MText渲染来说，主线程渲染、Worker渲染、统一渲染，光分类就好几种，细节参数一大堆。

AI要是靠猜，能给你编出个不存在的类名，还说得头头是道，逻辑自洽。

有了GitMCP就不一样了，答案直接从官方文档里扒，准确率直接从摇号变直达。

3. 三个现成的CAD项目MCP服务，拿过去就能用

这里给大家整理好了三个CAD相关的现成服务，直接抄地址就行。

3.1 realdwg‑web

负责浏览器端读取DWG/DXF文件，以及CAD数据库和转换相关的全套API。

地址：https://gitmcp.io/mlightcad/realdwg‑web

3.2 cad‑viewer

浏览器端的DWG/DXF查看与编辑器，也包含了Vue 3的集成说明。

地址：https://gitmcp.io/mlightcad/cad‑viewer

3.3 mtext‑renderer

专门做AutoCAD MText的Three.js渲染，主线程和Web Worker两种模式都支持。

地址：https://gitmcp.io/mlightcad/mtext‑renderer

4. 各个工具配置教程，手把手教你踩对坑

配置本身不难，就是不同工具的参数名有点区别，别抄串了。

4.1 Cursor

打开配置文件 ~/.cursor/mcp.json，把下面这段粘进去。

json 复制代码

{
  "mcpServers": {
    "realdwg-web Docs": {
      "url": "https://gitmcp.io/mlightcad/realdwg-web"
    },
    "cad-viewer Docs": {
      "url": "https://gitmcp.io/mlightcad/cad-viewer"
    },
    "mtext-renderer Docs": {
      "url": "https://gitmcp.io/mlightcad/mtext-renderer"
    }
  }
}

前面的服务名你随便起，叫张三李四都行，关键是url字段别写错。

保存完重启一下Cursor，就能看到服务已经可用了。

4.2 Windsurf

配置文件路径是 ~/.codeium/windsurf/mcp_config.json。

注意啊，这个工具里参数不叫url，叫serverUrl，别直接抄Cursor的配置，会失效。

json 复制代码

{
  "mcpServers": {
    "realdwg-web Docs": {
      "serverUrl": "https://gitmcp.io/mlightcad/realdwg-web"
    },
    "cad-viewer Docs": {
      "serverUrl": "https://gitmcp.io/mlightcad/cad-viewer"
    },
    "mtext-renderer Docs": {
      "serverUrl": "https://gitmcp.io/mlightcad/mtext-renderer"
    }
  }
}

4.3 VS Code

在项目目录下建 .vscode/mcp.json 文件。

这个区别更大，外层键是servers，还要额外加个type字段，值是"sse"。

json 复制代码

{
  "servers": {
    "realdwg-web Docs": {
      "type": "sse",
      "url": "https://gitmcp.io/mlightcad/realdwg-web"
    },
    "cad-viewer Docs": {
      "type": "sse",
      "url": "https://gitmcp.io/mlightcad/cad-viewer"
    },
    "mtext-renderer Docs": {
      "type": "sse",
      "url": "https://gitmcp.io/mlightcad/mtext-renderer"
    }
  }
}

4.4 Claude Desktop

这个得借助mcp‑remote工具来调用，写法不一样。

json 复制代码

{
  "mcpServers": {
    "realdwg-web Docs": {
      "command": "npx",
      "args": [
        "mcp-remote",
        "https://gitmcp.io/mlightcad/realdwg-web"
      ]
    },
    "cad-viewer Docs": {
      "command": "npx",
      "args": [
        "mcp-remote",
        "https://gitmcp.io/mlightcad/cad-viewer"
      ]
    },
    "mtext-renderer Docs": {
      "command": "npx",
      "args": [
        "mcp-remote",
        "https://gitmcp.io/mlightcad/mtext-renderer"
      ]
    }
  }
}

4.5 Cline

这个配置最省事，直接填url就行，还能设置自动审批权限。

json 复制代码

{
  "mcpServers": {
    "realdwg-web Docs": {
      "url": "https://gitmcp.io/mlightcad/realdwg-web",
      "disabled": false,
      "autoApprove": []
    },
    "cad-viewer Docs": {
      "url": "https://gitmcp.io/mlightcad/cad-viewer",
      "disabled": false,
      "autoApprove": []
    },
    "mtext-renderer Docs": {
      "url": "https://gitmcp.io/mlightcad/mtext-renderer",
      "disabled": false,
      "autoApprove": []
    }
  }
}

5. 配置完就完事了？大错特错

很多人配置完就扔一边了，用了两天说这东西没用。

就像你给手机装了个外卖APP，你不下单不填地址，它能自己给你送饭吗？

你得明确告诉AI：先去读这个MCP的文档，再回答我的问题。

你要是只说"帮我写个CAD查看组件"，AI大概率还是靠老记忆瞎写，配置了等于白配。

正确的问法得是：用cad‑viewer Docs这个MCP，先查最新文档，再基于@mlightcad/cad‑viewer写个Vue 3组件，实现从URL加载DWG文件。

把饭递到它嘴边，它才不会乱吃垃圾桶里的过期知识。

6. 三个实用提问模板，直接抄作业

给大家整理了三个高频场景的提问模板，拿去改改关键词就能用。

6.1 CAD Viewer 组件场景

就这么问：

请使用cad‑viewer Docs MCP。我在做Vue 3项目，先查@mlightcad/cad‑viewer的最新文档，然后讲一下推荐的安装方式，怎么初始化MlCadViewer，怎么从远程URL加载DWG，baseUrl对字体和模板有什么影响，最后给一个最小可用的Vue 3组件。

核心逻辑就是：先查文档，再讲原理，最后写代码，顺序不能乱。

6.2 底层DWG解析场景

要用realdwg‑web做底层解析的时候，这么问：

使用realdwg‑web Docs MCP。我需要在浏览器里解析DWG文件，讲一下怎么创建数据库、怎么设置工作数据库、怎么读取ArrayBuffer、怎么区分DWG和DXF，还有AcDbOpenDatabaseOptions是干嘛的，最后给个TypeScript示例。

底层API最容易和别的库记混，让它对着文档说，准很多。

6.3 MText 渲染选型场景

要处理大量MText的时候，这么问：

使用mtext‑renderer Docs MCP。我要用Three.js渲染AutoCAD MText，对比一下MainThreadRenderer、WebWorkerRenderer、UnifiedRenderer的区别，渲染几千个MText实体用哪个合适，最后给个TypeScript示例。

性能选型这种事，对着官方文档看，总比AI凭感觉推荐靠谱。

7. 多个MCP一起用，打通全链路

做完整的DWG查看器，肯定不是只用一个库。

从文件解析，到数据模型，再到三维渲染，最后到文本渲染，是一整条技术链路。

以前AI只能单个库单个库地猜，连起来就乱套了，数据流全是错的。

现在你可以把三个MCP都配上，然后直接让AI讲清楚整个数据流。

比如直接说：我要做DWG查看器，同时用这三个MCP服务，讲清楚从DWG文件到最终渲染的完整数据流向。

它就能跨仓库把整个技术链串起来，不会东一榔头西一棒子。

8. 我最推荐的三步工作流

用了一段时间，我总结出个三步法，踩坑少，效率高。

8.1 第一步：先读文档，再写代码

写代码之前，先让AI用MCP把相关文档过一遍，总结一下当前API和推荐用法。

别上来就让它写，写得快错得快，最后改bug的时间比写代码还长。

8.2 第二步：先要最小实现

别一上来就要什么架构设计、多层封装、扩展性拉满。

先要最小能跑的版本，没有多余的抽象，验证通了再慢慢迭代。

不然AI给你套三层封装，结果核心API写错了，你拆都不好拆。

8.3 第三步：对着文档自查

代码写完了，别着急往项目里粘。

先让它对着刚才读的文档自己检查一遍，看看API名、参数、导入路径有没有写错。

尤其是更新快的开源项目，这一步能帮你省超多调试时间。

9. 搭配本地源码，效果直接翻倍

有人会问，我本地已经有完整源码了，还要这个干嘛？

这俩不是替代关系，是黄金搭档。

本地源码是你的业务代码，GitMCP是第三方库的官方权威文档。

两个都开放给AI，它就能把你的业务逻辑和第三方库的正确用法结合起来。

不会出现"你的业务逻辑写得没问题，但库的调用方式全错"的尴尬局面。

10. 别把MCP当万能神药

最后得说句实在的，这东西不是万能的。

它解决的是"AI没上下文瞎猜"的问题，不是让AI直接变成CAD领域大神。

该让它核对版本就核对，该让它贴源码依据就贴。

别就问一句"怎么用cad‑viewer"就等着收标准答案，那它大概率还是给你瞎扯。

提问越具体，要求越明确，效果就越好。

11. 常见踩坑快速解答

11.1 配置完MCP服务不显示？

先查地址对不对。GitHub是所有者/项目名，GitMCP也是一模一样的，别多写少写字母，也别拼错单词。

11.2 AI死活不用MCP？

你直接在提问开头明说：回答前先使用xxx Docs MCP。

别跟它打哑谜，它有时候就是缺这句明确指令。

11.3 生成的代码还是老版本？

让它重新查文档，和生成的代码逐行对比。

明确告诉它：别用你训练数据里的旧API，以MCP里的最新文档为准。

12. 最后说两句

其实Vibe Coding的核心，从来不是让AI变多聪明。

而是给它正确的上下文，让它别瞎猜。

CAD这种专业领域，概念多、API杂、坑也多，光靠AI的通用知识，真的不够打。

花两分钟配个GitMCP，改一改提问方式，就能少踩好多坑。

自己维护开源项目的朋友，也可以这么玩。

把自己的仓库通过GitMCP暴露出去，用户用AI开发的时候，准确率直接上去，体验好太多。

毕竟，让AI从"猜API"变成"先读文档"，就这一步，体验差出一个量级。