Copilot 只会补半行代码,Cline 直接焊进你项目里替你改——开源 AI Agent
Copilot 只会补半行代码,Cline 直接焊进你项目里替你改——开源 AI Agent
本文基于 Cline v3.x(2026年7月最新版)编写。所有配置和代码均经过验证,可直接复制运行。
Cline 是一个开源的 VS Code 扩展,Apache 2.0 协议,永久免费。它不是代码补全工具,是真正的编程 Agent——你说需求,它自己找文件、规划改动、执行修改、跑测试、修 Bug。
你是不是也卡在这一步
写代码最烦的不是写,是改——
- 一个功能要动 5 个文件,你得自己找到每一处、改完、跑通、改 Bug
- Copilot 只能在你打字时补全一行,像打字助手,不会帮你改项目
- Cursor 好一点,但也得你自己动手,它只是建议
- ChatGPT 能给你代码片段,但你要手动复制粘贴,而且它看不到你的项目结构
- 想把一个 React 项目的状态管理从 Redux 换成 Zustand,手动改 20 个文件,一整天没了
- 写了个脚本但跑不通,报错信息看不懂,想找个人帮你 debug
只有 Copilot 的世界 有 Cline 的世界
┌──────────┐ ┌──────────┐
│ 改一个功能 │ │ 改一个功能 │
└────┬─────┘ └────┬─────┘
│ │
├─→ 自己找到 5 个文件 ├─→ 告诉 Cline 需求
├─→ 逐个打开文件 ├─→ Cline 自动读文件
├─→ 手动改代码 ├─→ Cline 规划改动
├─→ Copilot 补全一行 ├─→ Cline 逐个修改
├─→ 跑一遍看报错 ├─→ Cline 自己跑测试
├─→ 改 Bug ├─→ Cline 自己修 Bug
├─→ 再跑一遍 ├─→ 确认通过
└─→ 3 小时没了 │
全程你只说了 1 句话
确认了 5 次
Cline vs 其他编程工具
| 对比维度 | Cline | GitHub Copilot | Cursor | ChatGPT |
|---|---|---|---|---|
| 类型 | AI Agent | 代码补全 | AI IDE | 聊天 |
| 读取项目 | 全项目 | 当前文件 | 全项目 | 不能 |
| 改代码 | 自动改多个文件 | 补全当前行 | 建议你改 | 给片段 |
| 跑命令 | 自动跑 | 不能 | 手动 | 不能 |
| 跑测试 | 自动跑+修 Bug | 不能 | 手动 | 不能 |
| 模型绑定 | 任意模型 | GPT-4 | 内置模型 | GPT-4 |
| 费用 | 免费(模型费另算) | $10/月 | $20/月 | $20/月 |
| 开源 | 是 | 否 | 否 | 否 |
| 离线使用 | 支持(Ollama) | 不支持 | 不支持 | 不支持 |
| 适合场景 | 改项目/写脚本 | 补全代码 | 日常开发 | 问答 |
一句话:Cline 在全项目读写、自动多文件修改、自动跑测试修 Bug、任意模型切换、支持本地 Ollama 这几点上是目前开源编程 Agent 里做得最完整的。
一、安装 Cline 配模型(5 分钟)
安装扩展
前提:VS Code 已装(版本 1.85 以上)。
按 Ctrl+Shift+X 打开扩展市场,搜「Cline」(不是 Claude),点安装,15MB,几秒装好。左侧出现机器人图标。
配置模型
点 Cline 图标 → 右上角设置 → API Provider 选一个。四种方案一张表说清楚:
| 方案 | API Provider | Base URL / 获取方式 | Model ID | 上下文窗口 | 费用估算 | 适合场景 |
|---|---|---|---|---|---|---|
| DeepSeek(推荐新手) | OpenAI Compatible | https://api.deepseek.com/v1 |
deepseek-chat |
64000 | ¥0.001/千 Token,改一个项目约 ¥1~5 | 日常改代码,性价比最高 |
| Ollama 本地 | Ollama | http://localhost:11434 |
qwen3:14b |
32768 | 免费 | 零成本尝鲜,需 16G+ 内存 |
| Claude | Anthropic | 去 console.anthropic.com |
claude-sonnet-4-20250514 |
200000 | $3/百万 Token,改一个项目约 $1~5 | 复杂重构,最强但贵 |
| OpenRouter | OpenRouter | https://openrouter.ai/api/v1 |
deepseek/deepseek-chat 等 |
按模型 | 有免费额度 | 多模型自由切换 |
本地模型零成本,但 14B 模型需要 16G 以上内存,推理速度比云端慢。7B 以下推理不够稳,简单任务才能用。
验证配置
配好模型后,在 Cline 聊天框输入:
你好,确认你能读取我的项目
Cline 会列出当前工作区的文件结构,说明配置成功。
二、Plan 模式先分析,Act 模式再动手
Cline 最聪明的设计:把「思考」和「动手」拆成两个模式。
两种模式对比
| 维度 | Plan 模式 | Act 模式 |
|---|---|---|
| 行为 | 读文件、分析、出计划 | 执行计划、改代码、跑命令 |
| 改代码 | 不改 | 改,每步展示 diff |
| 跑命令 | 不跑 | 跑,每步等你确认 |
| 适合阶段 | 先理解项目 | 再执行改动 |
| 速度 | 快 | 慢(每步确认) |
操作流程
1. 切 Plan 模式 → 告诉 Cline 需求
│
▼
2. Cline 读文件、分析项目结构、生成执行计划
│
▼
3. 你审查计划 → 方向对不对?顺序对不对?
│
▼
4. 切 Act 模式 → Cline 按计划执行
│
▼
5. 每步改代码都展示 diff → 你确认 → 写入
│
▼
6. Cline 跑测试 → 报错 → 自己修 → 再跑
│
▼
7. 全部通过 → 完成
Plan 模式实战
切到 Plan 模式,输入需求:
把这个 React 项目的状态管理从 Redux 换成 Zustand
Cline 的输出:
## 执行计划
### 分析
当前项目使用 Redux Toolkit,共 8 个文件引用了 Redux:
- src/store/index.ts
- src/store/slices/userSlice.ts
- src/store/slices/cartSlice.ts
- src/hooks/useUser.ts
- src/hooks/useCart.ts
- src/pages/Profile.tsx
- src/pages/Cart.tsx
- src/App.tsx
### 步骤
1. 安装 zustand:`npm install zustand`
2. 创建 src/store/userStore.ts(替代 userSlice)
3. 创建 src/store/cartStore.ts(替代 cartSlice)
4. 修改 src/hooks/useUser.ts(改为 zustand hook)
5. 修改 src/hooks/useCart.ts
6. 修改 src/pages/Profile.tsx
7. 修改 src/pages/Cart.tsx
8. 修改 src/App.tsx(删除 Provider)
9. 删除旧 Redux 文件
10. 跑 `npm run build` 验证
### 风险
- 第 8 步删除 Provider 后可能有子组件依赖 Provider context
- 建议先改组件再删 Provider
是否按此计划执行?
你扫一眼没问题,切 Act 模式。
Act 模式实战
Cline 按计划逐步执行,每一步:
- 改代码 → 展示 diff(红了删的,绿了加的)→ 你点 Approve
- 跑命令 →
npm install zustand→ 你点 Approve - 跑测试 →
npm run build→ 报错了 - 修 Bug → Cline 自己看报错 → 找到问题 → 改代码 → 再跑
- 通过 → 全部完成
自动审批(Auto Approve)
每次确认很烦?可以开启自动审批部分操作:
| 自动审批项 | 建议 | 说明 |
|---|---|---|
| 读文件 | 开启 | 读文件不会改任何东西 |
| 写文件 | 谨慎开启 | 建议 Act 模式手动确认 |
| 执行命令 | 谨慎开启 | 建议只开安全的命令 |
| 使用浏览器 | 关闭 | Cline 可以打开浏览器 |
建议:读文件自动审批,写文件和执行命令手动审批。安全又不太烦。
三、用自然语言驱动真实项目
不需要会编程,只需要把需求说清楚。
万能 Prompt 公式
做什么:[一句话目标]
用什么:[技术栈,如 HTML+CSS / Python / React]
怎么验收:[预览网页 / 能运行 / 输出 CSV]
有什么限制:[不要用框架 / 全部 inline style / 保持简单]
实战 1:写脚本
做什么:用 Python 写一个脚本,读取文件夹里所有 PNG 图片,转成 WebP 格式
用什么:Python + Pillow 库
怎么验收:运行后输出转换结果列表
有什么限制:质量 80%,保留原文件
Cline 自己写脚本 → 在终端跑了一遍 → 列出转换结果 → 问你是否删除原文件。从头到尾你只说了一句话。
# Cline 生成的脚本
from PIL import Image
from pathlib import Path
import os
def convert_png_to_webp(input_dir, quality=80):
"""将目录下所有 PNG 转换为 WebP"""
results = []
for png_file in Path(input_dir).glob("*.png"):
webp_path = png_file.with_suffix(".webp")
img = Image.open(png_file)
img.save(webp_path, "WEBP", quality=quality)
original_size = png_file.stat().st_size / 1024
new_size = webp_path.stat().st_size / 1024
ratio = (1 - new_size / original_size) * 100
results.append({
"file": png_file.name,
"original_kb": f"{original_size:.1f}KB",
"webp_kb": f"{new_size:.1f}KB",
"saved": f"{ratio:.1f}%",
})
return results
if __name__ == "__main__":
results = convert_png_to_webp(".", quality=80)
print(f"转换完成,共 {len(results)} 个文件:")
print(f"{'文件名':<30} {'原始大小':<12} {'WebP大小':<12} {'节省'}")
print("-" * 70)
for r in results:
print(f"{r['file']:<30} {r['original_kb']:<12} {r['webp_kb']:<12} {r['saved']}")
实战 2:做网页
做什么:用 HTML+CSS 做一个博客主页
配色:紫蓝渐变
包含:导航栏、文章列表、标签云
有什么限制:不用框架,全部 inline style
Cline 自己建文件夹 → 写 HTML → 写 CSS → 打开浏览器预览。改内容直接在文件里改。
实战 3:改现有项目
做什么:把这个项目的配色从蓝色改成紫色
导航栏加一个搜索框
列表页加分页功能
Cline 先 Plan:列出要改的 3 个文件和每处改动位置 → 你确认 → 切 Act → 逐个修改,每步给你看 diff。5 步改完,页面刷新效果就对。
实战 4:Debug
做什么:这个 Python 脚本跑不通,帮我 debug
报错信息:
Traceback (most recent call last):
File "app.py", line 42, in <module>
result = process_data(data)
File "app.py", line 28, in process_data
return json.loads(response.text)
json.decoder.JSONDecodeError: Expecting value: line 1 column 1 (char 0)
Cline 读 app.py → 找到第 28 行 → 分析:response.text 返回空字符串 → 检查 response 的来源 → 发现 API URL 写错了 → 修复 → 跑一遍 → 通过。
四、MCP 工具与外部能力——终端、浏览器、扩展
Cline 的能力不止改代码——内置 Terminal、Browser、Filesystem、Git 四个 MCP 工具,还支持通过 MCP 协议接入数据库、GitHub 等外部服务。内置工具开箱即用,外部 MCP Server 按需配置。
内置 MCP 工具
| 工具 | 作用 | 安装方式 |
|---|---|---|
| Filesystem | 读写文件 | 内置 |
| Browser | 打开浏览器、截图 | 内置 |
| Terminal | 执行终端命令 | 内置 |
| Git | 版本控制操作 | 内置 |
配置 MCP Server
Cline 设置 → MCP → 添加 Server:
示例:连接数据库 MCP
{
"mcpServers": {
"database": {
"command": "npx",
"args": ["-y", "@modelcontextprotocol/server-postgres"],
"env": {
"DATABASE_URL": "postgresql://user:pass@localhost:5432/mydb"
}
}
}
}
配好后,Cline 可以直接查询数据库:
帮我查看 users 表有多少条记录,最近注册的 10 个用户是谁
Cline 调用 MCP → 执行 SQL → 返回结果 → 格式化展示。
常用 MCP Server
| MCP Server | 作用 | 安装 |
|---|---|---|
server-postgres |
查询 PostgreSQL | npx -y @modelcontextprotocol/server-postgres |
server-filesystem |
文件系统操作 | npx -y @modelcontextprotocol/server-filesystem |
server-github |
GitHub 操作 | npx -y @modelcontextprotocol/server-github |
server-fetch |
HTTP 请求 | npx -y @modelcontextprotocol/server-fetch |
server-memory |
持久记忆 | npx -y @modelcontextprotocol/server-memory |
终端操作(内置 Terminal 工具)
直接用自然语言让 Cline 跑命令:
帮我跑 npm run build 看看有没有报错
帮我跑 npm test 跑测试
帮我 git add . 然后 git commit -m "重构状态管理"
Cline 跑终端命令前会展示命令内容,等你确认:
Cline 想执行命令:
npm run build
说明:检查项目是否能正常构建
[Approve] [Deny]
可以配置只自动审批安全命令,危险命令仍需确认:
| 命令类型 | 自动审批 | 说明 |
|---|---|---|
ls / cat / grep |
安全 | 只读操作 |
npm run build / npm test |
安全 | 构建/测试 |
git status / git diff |
安全 | 只读 Git |
git add / git commit |
谨慎 | 修改仓库 |
git push |
危险 | 推到远程 |
rm / del |
危险 | 删除文件 |
npm install |
谨慎 | 安装依赖 |
浏览器操作(内置 Browser 工具)
Cline 可以打开浏览器、截图、点击、输入——用于测试网页效果。Cline 设置 → Browser → 开启即可。
帮我打开 localhost:3000 截个图看看页面效果
帮我测试一下登录功能:打开页面,输入用户名 admin,密码 123456,点登录,截图看结果
Cline 打开浏览器 → 输入地址 → 截图 → 展示给你看。或者自动点击、输入、截图。
五、.clinerules 文件——给 Cline 设项目规则
在项目根目录创建 .clinerules 文件,Cline 每次对话都会读取并遵守这些规则:
# 项目规则
## 代码风格
- 使用 TypeScript,不用 JavaScript
- 用函数组件 + Hooks,不用 class 组件
- 用 Tailwind CSS,不用 inline style
- 变量名用 camelCase,组件名用 PascalCase
## 项目结构
- 组件放在 src/components/
- 页面放在 src/pages/
- 工具函数放在 src/utils/
- API 调用放在 src/api/
## 命名规范
- 文件名用 kebab-case:user-profile.tsx
- 组件文件名用 PascalCase:UserProfile.tsx
- 测试文件加 .test:user-profile.test.ts
## 禁止
- 不要安装新的 npm 包,除非我明确同意
- 不要修改 package.json 的 scripts
- 不要删除已有代码,注释掉并说明原因
.clinerules相当于给 AI 立规矩。没有它,AI 可能用 JavaScript 而不是 TypeScript,用 class 组件而不是函数组件。
六、上下文管理——长对话不丢失
上下文窗口限制
| 模型 | 上下文窗口 | 大约能看多少代码 |
|---|---|---|
| qwen3:14b | 32768 | 约 800 行代码 |
| deepseek-chat | 64000 | 约 1600 行代码 |
| Claude Sonnet 4 | 200000 | 约 5000 行代码 |
上下文压缩
对话太长时,Cline 会提示上下文窗口快满了。这时用以下命令:
| 命令 | 作用 | 说明 |
|---|---|---|
/smol |
压缩上下文 | AI 自动总结之前的对话,释放窗口 |
/newtask |
开新会话 | 清空上下文,从头开始,保留项目文件 |
/clear |
清空对话 | 完全清空,和重启一样 |
/undo |
撤销上一步 | 回退最后一次文件修改 |
/role |
切换角色 | 切换 AI 人设 |
最佳实践
- 小任务拆开做——一个任务一个会话,做完
/newtask开新的 - 复杂任务用 Plan——先让 AI 理解全貌再动手
- 定期
/smol——对话超过 20 轮就压缩 - 写
.clinerules——不用每次重复说规则
七、常见问题与排坑
| 问题 | 原因 | 解决 |
|---|---|---|
| Plan 模式跳过直接 Act | 没切模式 | 先切 Plan 再说需求,分析完切 Act |
| 对话太长 AI 失忆 | 上下文窗口满了 | /smol 压缩或 /newtask 开新会话 |
| 不看 diff 就点确认 | 等于让 AI 乱改 | 每次确认前扫一眼改了什么 |
| 7B 模型跑复杂任务 | 推理不够稳 | 本地模型至少 14B 起步 |
| Cline 找不到项目文件 | 工作区没打开 | VS Code 打开项目文件夹 |
| 改完代码跑不通 | Cline 没跑测试 | 让它「跑一遍 build 看报错」 |
| API Key 报错 | Key 过期或额度用完 | 检查 API Key 和余额 |
| Ollama 模型太慢 | 本地推理慢 | 换云端 API,或换小模型 |
| 改错了文件 | Act 模式没看 diff | /undo 撤销,下次注意看 diff |
| MCP Server 连不上 | 依赖没装 | npm install 安装 MCP Server 依赖 |
几个容易踩的坑:
- 上来就用 Act 模式——AI 没理解项目全貌就改代码,容易改错地方。先 Plan 再 Act。
- 对话太长不清理——上下文窗口满了 AI 开始失忆,定期
/smol或/newtask。 - 不看 diff 就点确认——等于让 AI 在项目里随便改。每次确认前扫一眼改了什么。
- 用太小模型跑复杂任务——7B 以下 Plan 阶段就出错,后面全白费。本地模型至少 14B 起步。
- 不写
.clinerules——AI 不知道你的项目规范,可能用错技术栈、改错文件结构。
八、落地场景
| 场景 | 推荐模型 | 操作方式 | 费用 |
|---|---|---|---|
| 日常改 Bug | DeepSeek | Plan → Act | ¥1~5 |
| 大型重构 | Claude Sonnet 4 | Plan → Act | $1~5 |
| 写脚本 | DeepSeek | 直接 Act | ¥0.5~2 |
| 做网页 | DeepSeek | Plan → Act | ¥1~3 |
| Debug | DeepSeek | 直接 Act | ¥0.5~2 |
| 零成本尝鲜 | Ollama qwen3:14b | Plan → Act | 免费 |
| 代码审查 | DeepSeek | Plan 模式 | ¥0.5~1 |
| 写测试用例 | DeepSeek | Plan → Act | ¥1~3 |
什么情况不该用 Cline
- 只需要补全几行代码——GitHub Copilot 的行内补全更快更便宜,Cline 的优势是全项目改和多文件联动。
- 项目没有测试——Cline 改完代码会跑测试验证,没有测试就少了一层安全保障,容易改出暗坑。
- 涉密项目不能连外部 API——用 Ollama 本地模型可以,但推理速度慢且效果弱于云端模型,复杂任务会很吃力。
核心知识点回顾
- 安装:VS Code 扩展市场搜 Cline,15MB 几秒装好
- 配模型:DeepSeek(推荐新手)/ Ollama(免费)/ Claude(最强),任意模型自由换
- Plan + Act:Plan 模式分析项目出计划 → Act 模式逐个执行,每步展示 diff
- 万能 Prompt:做什么 + 用什么 + 怎么验收 + 有什么限制
- MCP 协议:连接数据库/GitHub/文件系统等外部工具
.clinerules:项目规则文件,给 AI 立规矩(技术栈、命名、结构)- 上下文管理:
/smol压缩、/newtask开新会话、/undo撤销 - 终端操作:Cline 帮你跑 build、test、git,安全命令自动审批
- Browser 操作:打开浏览器截图测试网页效果
- 对比优势:全项目读写 + 自动多文件改 + 自动跑测试修 Bug + 任意模型 + 本地 Ollama
本文所有配置和代码均经过验证,可直接复制执行。如有问题欢迎评论区交流。
觉得有用点个赞,下一篇把六件套串起来——用一个真实项目把全家桶全部跑通。
更多推荐


所有评论(0)