Vibe Coding、AI IDE/插件

概述

Vibe Coding，氛围编程，AI辅助编程，三剑客：

  • Google Gemini：
  • OpenAI GPT：
  • Anthropic Claude：

IDE

Cursor

基于VS Code开发。

特性：

  • AI驱动的代码生成：输入想要的内容，Cursor会将这些需求转换为实际代码。
  • 自动调试辅助：可以识别它生成的代码（或您编写的代码）中的错误或bug，并建议修复方案，使调试过程更快。
  • 上下文感知帮助：理解项目上下文。可查看所有文件，并提出适合您项目的建议，确保生成的代码与您已有的内容一致。
  • 文档和学习工具：提供文档的快速查阅，甚至可以为您解释代码。

快捷键：

  • Ctrl+L：打开侧边栏聊天窗口
  • Ctrl+K：打开一个内联提示用于代码生成。

生成的建议代码以预览或差异（diff）格式出现，可选择接受或放弃；基本循环：提示→生成→审查→接受→测试。

最佳实践

  • 清晰描述意图：尽可能清晰和具体地说明您的需求。
  • 逐步进行：将项目或问题分解成更小的任务，并逐个解决。迭代过程。
  • 经常审查和测试：AI生成的代码不完美。
  • 根据结果优化提示：重新措辞请求或添加更多细节。
  • 利用指导功能：API解读、代码块解释、优化、重构、提高可读性…。
  • 通过实践不断学习：有助于更好地编写提示。

Trae

字节跳动推出的基于VS Code的免费IDE，The Real AI Engineer缩写，内置Claude 3.5和GPT-4o等模型，支持智能代码生成与优化，原生中文支持，还具备多模态能力，适合Web开发、游戏开发等多种场景。

原本的MarsCode编程助手和Trae IDE已经合并，现在统一归属于Trae品牌。

Trae旗下包含两款产品：IDE和插件。

功能：

  • Builder模式：支持Vibe Coding，拆解需求自动生成完整项目
  • Chat模式：交互式问答，实时编程助手，深度上下文理解
  • 多模态输入：图片转代码、手绘稿生成界面、Webview实时预览
  • 顶级模型免费：Claude 3.5 Sonnet、GPT-4o、Gemini 2.5 Pro完全免费

MCP

MCP允许LLM访问自定义工具和服务，MCP Servers是支持MCP协议的服务，提供工具和功能。支持添加线上和本地部署的服务，两者的能力差异主要体现在部署方式、适用场景、安全管控和功能扩展性上；本地服务依赖stdio，仅支持简单进程间通信；远程服务通过HTTP/SSE实现跨网络交互。

Trae内置MCP市场，可快速添加第三方MCP Servers；配置MCP Server将外部工具和服务连接至IDE进行使用；可定义调用MCP工具的Agent，拓展Trae的执行能力。

规则

用于规范AI在IDE内的行为，包括：

  • 个人规则：全局粒度，基于个人使用习惯和需求定制的规则，旨在让输出更符合用户的个性化要求。如语言风格、内容深度、交互方式等规则。配置文件user_rules.md
  • 项目规则：项目粒度，配置文件project_rules.md

智能体

在这里插入图片描述

上下文

支持多种形态的上下文：

  • Code
  • Files
  • Folder
  • Workspace
  • Docs：上传个人文档集
  • Web：#Web后输入问题并发送，触发联网搜索

SOLO

SOLO模式集成包括IDE在内的多种工具。你只需表达需求，它就会基于目标主动推进完整开发流程。

Windsurf

官网，基于Codeium技术，推出Cascade技术，将Copilot和Agent完美融合。支持深度项目理解，能够处理复杂的多文件编辑任务。

功能：

  • Cascade技术：深度理解项目结构，处理复杂编程任务
  • Agent模式：助手可以主动调用各种工具，实现自主编程
  • 多文件编辑：同时处理多个文件，保持代码一致性
  • 智能上下文：自动记住项目上下文，越用越聪明

Kiro

官网，亚马逊推出的IDE，目前还是预览版。

插件

Claude Code

GitHub，Anthropic推出的智能编程助手（代理式编程工具），可直接集成到终端环境中，并通过自然语言命令实现更快编程。
在这里插入图片描述
特点：

  • 直接集成终端：无需额外服务器或复杂配置
  • 理解整个代码库：能够分析项目结构和代码逻辑
  • 自然语言交互：用普通话描述需求，Claude帮你实现
  • 安全隐私设计：直连Anthropic API，无中间服务器
  • 实际操作能力：真正执行文件编辑、Git操作等任务

Claude Code提供多种认证选项：

  • Anthropic Console：通过OAuth 登录https://console.anthropic.com账户
  • Claude Pro/Max订阅：使用Claude.ai账户登录
  • 企业平台：配置Amazon Bedrock或Google Vertex AI
命令功能示例
claude启动交互模式claude
claude "task"执行一次性任务claude "fix the build error"
claude -p "query"运行后退出claude -p "explain this function"
claude -c继续最近对话claude -c
claude -r恢复之前对话claude -r
/clear清除对话历史> /clear
/help显示帮助> /help
exit或Ctrl+C退出> exit

安装及使用

npm install -g @anthropic-ai/claude-code
claude
# 让 Claude 分析项目
summarize this project
# 生成项目指南
/init
# 提交
commit the generated CLAUDE.md file
# 解释文件结构
explain the folder structure
# 修复 bug
there is a NPE in line 77, fix it
# 重构代码
refactor the authentication module to use async/await instead of callbacks
# 解决冲突
help me resolve merge conflicts
# 编写测试
write unit tests for the calculator functions
# 性能优化
analyze the performance of this code and suggest optimizations
# 代码审查
review my changes and suggest improvements
# 添加注释
add JSDoc comments to the undocumented functions in auth.js
# 触发深度思考
I need to implement OAuth2 authentication. Think deeply about the best approach.
# 加强思考深度
think harder about edge cases we should handle
# 思考安全问题
think about potential security vulnerabilities in this approach
# 创建优化命令
echo "Analyze the performance of this code and suggest three specific optimizations:" > .claude/commands/optimize.md
# 使用自定义命令
/project:optimize
# 使用Git worktrees运行多个Claude Code实例
# 创建新的工作树
git worktree add ../project-feature-a -b feature-a
# 在新工作树中运行 Claude
cd ../project-feature-a
claude
# 管道操作
cat build-error.txt | claude -p 'explain the root cause of this error'
# 添加到构建脚本
npm run "lint:claude": "claude -p 'look at changes vs main and report issues'"
# 结构化输出
claude -p 'analyze this code' --output-format json > analysis.json
# ~/.claude/settings.json全局设置
{"permissions": {"allow": ["Bash(npm run lint)","Bash(npm run test:*)"],"deny": ["Bash(curl:*)"]}
}

如果出现command not found：
在这里插入图片描述
解决方法：
在这里插入图片描述
将D:\Program Files\nodejs\node_global加入PATH环境变量。
在这里插入图片描述
如果出现上面报错，或打开https://claude.ai，出现如下提示：
在这里插入图片描述
解决方法：切换地区
在这里插入图片描述
又遇到新问题：
在这里插入图片描述
添加环境变量CLAUDE_CODE_GIT_BASH_PATH=D:\Program Files\Git\bin解决问题。

GitHub Copilot

IDE插件。

功能：

  • Claude 3.5 Sonnet集成：新增Claude模型支持，代码质量显著提升
  • Copilot Vision：上传截图生成代码，设计稿秒变界面
  • 免费版本：每月2000次代码补全和50次聊天，个人用户可免费使用
  • 企业级功能：Pro+计划支持Claude Opus 4.1，处理复杂编程任务

Gemini CLI

GitHub，Google发布的一款基于Gemini 2.5 Pro模型的本地AI代理，可在终端内构建应用、调试代码、解析代码库并获取实时数据。

功能：

  • 每天最多可免费请求1000次；
  • 集成Google搜索，维基百科、GitHub都可；
  • read_file和read_folder、文件编辑、脚本生成、Bash工作流自动化；
  • 集成到Git代码块，询问关于代码块的信息；
  • 使用MCP服务器和工具进行扩展，如使用Google Cloud的GenMedia API生成视频，或通过预建端点向外部模型发送提示；
  • 以Gemini Code Assist插件的形式集成IDE。使用：运行终端提示、自动生成代码、调试、无需切换标签即可触发CLI请求。

安装

npx https://github.com/google-gemini/gemini-cli
# 或
npm install -g @google/gemini-cli
gemini

使用NPX来获取CLI包并初始化提示，将被引导完成以下过程：

  1. 主题选择：选择浅色或深色的终端主题。
  2. 身份验证：可通过以下方式进行身份验证：
    • Google帐户：推荐，无需设置
    • Gemini API Key：如果想要更高的请求限制

一旦通过身份验证，将进入Gemini CLI界面。
在这里插入图片描述

Augment Agent

官网，专为大型代码库打造，具备20万tokens的超长上下文、持久记忆和深度工具集成的IDE AI插件，支持Vim、GitHub、Slack。

功能：

  • 代码理解、持久化记忆；
  • 渗透完整开发工作流：可集成到项目管理工具（如Jira、Linear）、文档工具（如Confluence、Notion）；
    @GitHub：创建分支、提交代码、发起PR
    @Linear：问题检测与解决
    @Notion、@JIRA、@Confluence：将上下文信息转化为实际代码
  • 可视化调试：拖入截图，自动识别UI问题（CSS、布局、逻辑），并提供修复建议。
  • 版本控制：每一步操作都会被记录，每一次编辑都可以撤销。

CodeBuddy

官网，腾讯提供的AI编码助手，提供两种版本：

  • IDE：基于腾讯元宝
  • 插件。

两者都针对中文开发场景深度优化，支持智能文档生成、RAG代码库理解等高级功能。

Lingma

即通义灵码，阿里云提供的智能编码辅助工具，具备代码智能生成、智能问答、多文件修改等能力，支持多种主流编程语言，可助力开发者提升编码效率，引领AI原生研发新范式。正在规划推出IDE版本。

功能：

  • 智能体模式，端到端任务执行
  • 行间预测，NES
  • 长期记忆功能

文心快码

即Baidu Comate，百度发布的国内首个多模态、多智能体协同的AI原生开发环境，通过多智能体协同能自动规划执行任务，试图主导开发流程，为开发者带来全新开发体验。

功能：

  • 代码补全、单测生成
  • Zulu多智能体协同模式，生成速度慢
  • 设计稿转代码，即F2C，Figma to Code

Cline

GitHub，开源Coding Agent。原Claude Dev。

功能：

Streaming Tools Call

流式返回调用工具，边生成边调用，边调用边检测，大大提高Agent系统的核心能力。

CodeWhisperer

Amazon推出专为企业环境设计，AWS Toolkit插件，支持多种IDE，在安全性和合规性方面表现出色。个人用户可以免费使用基础功能。

在线AI开发平台

Firebase Studio

Google推出的免费AI应用构建器，与Firebase生态深度集成。特别适合需要后端服务的应用开发，AI能自动配置数据库、认证、云函数等服务。

功能：

  • Firebase集成： 自动配置云服务
  • 多平台支持： Web、移动端应用都能生成

Lovable

官网

功能：

  • 设计转代码： 上传设计稿，AI自动生成React代码
  • 多人协作模式： 实时协作，支持设计师和开发者同时工作
  • 全栈生成： 前端+后端+数据库，一站式解决
  • Claude集成： 基于最新Claude模型，理解能力超强

Bolt.new

官网，StackBlitz出品，结合Artifacts、V0和Replit的优势。支持React、Vue、Svelte、Angular等主流框架，真正实现用英语编程，几分钟内就能从想法变成可运行的Web应用。

功能：

  • 实时预览： 边写边看，即时反馈
  • 一键部署： 集成Vercel、Netlify等部署平台

v0.dev

官网，Vercel推出的AI UI生成工具，专注于生成高质量的React组件。采用ShadCN UI设计系统，生成的界面美观且现代化。

功能：

  • UI专精：专注于界面生成，质量极高
  • ShadCN集成：统一的设计语言，风格一致
  • 组件化：生成可复用的React组件
  • Vercel部署：一键部署到Vercel平台

Replit

集成在Replit在线IDE中的AI助手，支持Python、JavaScript、Go等多种编程语言。最大优势是云端开发，无需本地环境配置，特别适合快速原型开发和团队协作。

libra.dev

官网，同时还有开源版本，用于快速构建以自然语言驱动的SaaS应用。

特点：

  • 部署选项多样：
    • 托管平台：通过Cloudflare Workers无服务器架构提供快速上线、一键部署、自动 TLS/SSL、版本控制、回滚等功能
    • 开源自部署：支持本地开发与自部署，自由配置API Key与基础架构
  • 面向情境选择建议：
    • 选择托管平台：适合快速上线、追求团队协作、希望获得技术支持等场景
    • 选择开源版本：适合对数据自主、深度定制、成本控制或离线部署有需求的技术团队

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如若转载，请注明出处：http://www.pswp.cn/bicheng/95019.shtml
繁体地址，请注明出处：http://hk.pswp.cn/bicheng/95019.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

Unity高级UI拖动控制器教程

Unity高级UI拖动控制器教程

在游戏开发过程中，UI组件的拖动功能是一个常见的需求。特别是在需要实现拖动、边界检测、透明度控制以及动画反馈等功能时，编写一个高级UI拖动控制器将非常有用。在本文中，我们将创建一个支持多种Canvas模式和更精确边界检测的高级UI拖动控制…
阅读更多...
零基础上手：Cursor + MCP 爬取 YouTube 视频数据

零基础上手：Cursor + MCP 爬取 YouTube 视频数据

前言 大模型与 AI 应用越来越普及的今天，实时、稳定地获取网络数据变得尤为重要。无论是做内容分析、趋势研究还是自动化任务，爬取和处理数据始终是绕不开的一环。 传统爬虫往往面临封禁、验证码、动态渲染等难题，而 Bright Data MCP&#x…
阅读更多...
frp 一个高性能的反向代理服务

frp 一个高性能的反向代理服务

文章目录项目概述核心特性系统架构快速开始1. 下载安装2. 服务端快速配置3. 客户端快速配置4. 验证连接配置文件说明代理类型TCP/UDP 代理HTTP/HTTPS 代理安全代理 (STCP/SUDP)P2P 代理 (XTCP)插件系统静态文件服务HTTP/SOCKS5 代理协议转换使用场景远程办公Web 服务发布游戏服…
阅读更多...
Android -第二十一次技术总结

Android -第二十一次技术总结

一、activity与Fragment的通信有哪些？使用接口进行通信的逻辑与代码示例使用接口通信的核心是解耦，通过定义一个接口作为通信契约，让 Fragment 不依赖于具体的 Activity 类型。1. 定义通信接口（在 Fragment 内）首先&am…
阅读更多...
【算法】78.子集--通俗讲解

【算法】78.子集--通俗讲解

通俗易懂讲解“子集”算法题目 一、题目是啥？一句话说清 给你一个不含重复元素的整数数组，返回所有可能的子集（包括空集和它本身）。 示例： 输入：nums = [1,2,3] 输出：[[], [1], [2], [1,2], [3], [1,3], [2,3], [1,2,3]] 二、解题核心 使用回溯法（递归）或位运算来…
阅读更多...
Cherrystudio的搭建和使用

Cherrystudio的搭建和使用

1、下载和安装 Cherry Studio 官方网站 - 全能的 AI 助手 2、配置LLM 3、聊天助手 3.1 添加和编辑助手 3.2 选择LLM 3.3 对话聊天 4、配置MCP 4.1 安装MCP执行插件 4.2 安装 node和npm Node.js — Download Node.js npm -v 10.9.3 node -v v22…
阅读更多...
基于Matlab结合肤色检测与卷积神经网络的人脸识别方法研究

基于Matlab结合肤色检测与卷积神经网络的人脸识别方法研究

近年来，随着人工智能与计算机视觉技术的发展，人脸识别在人机交互、安防监控、身份认证等领域得到了广泛应用。本文提出了一种基于 MATLAB 平台，结合 肤色检测与卷积神经网络（CNN） 的人脸识别方法。该方法首先利用肤色模…
阅读更多...
在八月点燃AI智慧之火：CSDN创作之星挑战赛开启灵感盛宴

在八月点燃AI智慧之火：CSDN创作之星挑战赛开启灵感盛宴

在八月点燃AI智慧之火：CSDN创作之星挑战赛开启灵感盛宴八月骄阳似火，智能时代的技术热情同样炽热。在这个充满创新活力的季节，「AIcoding八月创作之星挑战赛」正式拉开帷幕，为CSDN的创作者们打造一个展示才华、碰撞灵感的专业舞台…
阅读更多...
解密 Vue 3 shallowRef：浅层响应式 vs 深度响应式的性能对决

解密 Vue 3 shallowRef：浅层响应式 vs 深度响应式的性能对决

📖 概述 shallowRef() 是 Vue 3 中的一个组合式 API 函数，用于创建浅层响应式引用。与 ref() 不同，shallowRef() 只在其 .value 被直接替换时触发响应式更新，不会深度监听对象内部属性的变化。 🎯 基本概念 什么是 sh…
阅读更多...
Linux进程间通信（IPC）深入解析

Linux进程间通信（IPC）深入解析

Linux进程间通信（IPC）深入解析 1 概述 Linux 进程间通信 (Inter-Process Communication, IPC) 是不同进程之间交换数据与同步操作的机制。现代 Linux 内核提供了多种 IPC 方式，从传统的管道和 System V IPC 到现代的套接字和 D-Bus&#xff0…
阅读更多...
TensorFlow-GPU版本安装

TensorFlow-GPU版本安装

前言： （1）因项目需求，需要安装TensorFlow-GPU版本，故本文在此记录安装过程。 （2）有注释，优先看注释 （3）本文所使用的GPU为NVIDIA GeForce RTX 5080 Laptop GP…
阅读更多...
Elasticsearch 索引字段删除，除了 Reindex 重建索引还有没有别的解决方案？

Elasticsearch 索引字段删除，除了 Reindex 重建索引还有没有别的解决方案？

unsetunset1、问题来源unsetunset在生产环境维护 Elasticsearch 集群的过程中，经常会遇到这样的场景：业务需求变更导致某些字段不再使用，或者早期设计时添加了一些冗余字段，现在需要清理掉。最近球友在公司的一个项目中就遇到了这…
阅读更多...
Ubuntu虚拟机磁盘空间扩展指南

Ubuntu虚拟机磁盘空间扩展指南

这是一份详细且易于理解的 Ubuntu 虚拟机磁盘空间扩展指南。本指南涵盖了两种主流虚拟机软件（VirtualBox 和 VMware）的操作步骤，并分为 “扩展虚拟磁盘” 和 “在 Ubuntu 内部分配新空间” 两大部分。重要提示：在进行任何磁盘操作…
阅读更多...
教程1:用vscode-＞ptvsd-创建和调试一个UI(python)-转载官方翻译（有修正）

教程1:用vscode-＞ptvsd-创建和调试一个UI(python)-转载官方翻译（有修正）

vscode用python开发maya联动调试设置 3dsMax Python开发环境搭建 3文联动之debugpy调试max‘python. 3文联动之socket插槽注入max‘python 本教程是max主动接收创建代码的方式（预先运行界面，通过按钮主动读取py脚本，执行断点）&…
阅读更多...
龙迅#LT7621GX适用于两路HDMI2.1/DP1.4A转HDMI2.1混切应用,分辨率高达8K60HZ!

龙迅#LT7621GX适用于两路HDMI2.1/DP1.4A转HDMI2.1混切应用,分辨率高达8K60HZ!

1. 描述LT7621GX是一款高性能两路HDMI2.1/DP1.4转HDMI2.1混合开关芯片，用于显示应用。 HDCP RX作为HDCP中继器的上游，可以与其他芯片的HDCP TX配合，实现中继器功能。 对于HDMI2.1输入，LT7621GX可以配置为3/4通道。自适应均衡使其适…
阅读更多...
【Ruoyi 解密 - 12. JDK17的新特性】------ 从Java 8 到 Java 17：向Scala看齐的“简洁革命”，同宗JVM下的效率狂飙

【Ruoyi 解密 - 12. JDK17的新特性】------ 从Java 8 到 Java 17：向Scala看齐的“简洁革命”，同宗JVM下的效率狂飙

从Java 8到Java 17：抄作业Scala？JVM同宗下的Ruoyi开发效率狂飙！ 上一篇我们聊到JDK 17对Python的柔性借鉴，可深入用下来才发现——这哪够！对Ruoyi开发者来说，JDK 17真正的“王炸”，是把同根JVM的…
阅读更多...
大模型 “轻量化” 之战：从千亿参数到端侧部署，AI 如何走进消费电子？

大模型 “轻量化” 之战：从千亿参数到端侧部署，AI 如何走进消费电子？

一、大模型 “轻量化” 的行业背景在 AI 技术蓬勃发展的当下，大模型已然成为行业焦点。从 GPT-4 突破万亿级参数量，到 DeepSeek-R1 迈向千亿参数规模，大模型的参数扩张趋势显著。然而，这种规模的增长也带来了诸多挑战。以 GPT-4 为…
阅读更多...
香港电讯与Microsoft香港推出新世代“Teams Phone” 解决方案

香港电讯与Microsoft香港推出新世代“Teams Phone” 解决方案

香港电讯成为香港首家提供 “Microsoft Operator Connect”的本地电讯营运商1 香港电讯（股份代号：6823）【香港 • 2025年2月11日】 – 香港电讯宣布与 Microsoft 香港合作推出 “Operator Connect”，成为全港首家为企业客户提供全…
阅读更多...
PlantUML描述《分析模式》第3章观察和测量（2）

PlantUML描述《分析模式》第3章观察和测量（2）

lantUML描述《分析模式》第2章“当责”（1） PlantUML描述《分析模式》第2章“当责”（2） PlantUML描述《分析模式》第3章观察和测量（1） 原图3.8 EA绘制 图3.8 递归关系用于记录证据和评估。 PlantUML sta…
阅读更多...
轮廓周长，面积，外界圆，外界矩形近似轮廓和模板匹配和argparse模块实现代码参数的动态配置

轮廓周长，面积，外界圆，外界矩形近似轮廓和模板匹配和argparse模块实现代码参数的动态配置

目录 一.轮廓操作 1.轮廓特征的引入与筛选 2.轮廓排序和精准定位 3.外接圆与外接矩形的计算与绘制 二.轮廓近似 1.轮廓近似的基本概念 2.轮廓近似的实现方法和核心步骤 3. 近似精度参数的设定逻辑 4.轮廓定位方法 三.模板匹配 1.模板匹配技术原理与实现流程 2.技术要…
阅读更多...
最新文章

Copyright @ 2022~2023