工作中的Ai工具汇总

背景

生活在AI的今天,coding可选择提效的大模型有很多,用对了事半功倍,下面分场景介绍下目前工作中的提效工具

vscode插件形式

GitHub Copilot

类别 具体内容
优点 1. 代码生成能力强:2. 多语言支持:覆盖 100 多种编程语言3. IDE 集成完善:支持 VS Code、等主流开发工具,无缝融入开发环境4. 提高开发效率:减少重复性代码编写,节省时间,提升编码速度
缺点 1. 存在隐私风险:2.需要翻墙 3.免费版本效率慢且无法使用calude模型

Lingma - Alibaba Cloud AI Coding Assistant

类别 具体内容
优点 1. 对中文支持更优:针对中文注释、中文语境的理解更精准,符合国内内开发者使用习惯 2. 本地化服务:无需翻墙即可使用,3.提供免费版本:基础功能免费
缺点 1.训练数据中开源代码占比相对较少,对部分国际主流框架的支持精度略逊 2.高级功能需订阅付费,

除此之外 你可以使用 百度等推出的vscode插件,对于问答形式,agent模型均较好的支持

cursor trae 等AI编辑器

Cursor是一款专注于 AI 辅助编程的编辑器,优势在于全局上下文和大项目支持

类别 具体内容
优点 1. 深度 AI 集成:作为原生 AI 驱动的编辑器,2.AI 功能与编辑体验深度融合,支持实时代码生成、重构建议和上下文对话式编程,交互流畅度高 2上下文理解强:能更好地结合整个项目文件结构和代码上下文生成建议 3.多模型支持
缺点 1.需要付费 且需要翻墙 2.非付费效率会排队较慢

deepwiki 辅助文档

DeepWiki 是由 Cognition Labs 基于其产品 Devin 开发的一款 AI 驱动的 GitHub 源码阅读与分析工具。它旨在帮助开发者更高效地阅读、理解和分析 GitHub 上的源码

使用方式如下 直接找到github地址练级 比如 https://github.com/vuejs/vue 直接将 github 替换为 deepwiki 比如 https://deepwiki.com/vuejs/vue 即可生成文档,可以当作一个rag进行提问,对于你了解项目 或者深入细节有很大提速

UI设计图转前端代码 v0

v0.app 是 Vercel 推出的一款 AI 驱动的低代码开发工具,核心是通过自然语言 prompt 快速生成可直接使用的网页界面,无需手动编写代码。

尝试了很多的图片转代码的工具 v0的效果是不错的 尤其是于tailwindcss 和 react的代码生成,

我常用的 prompt如下

js 复制代码
你是前端开发工程师,你擅长于react 技术栈,且很擅长tailwindcss原子化css,请基于我给你的图片,生成前端代码

生成的效果如下,大致文档结构是ok的,细节处需要自己优化,对于付费模型 可以传入figma设计图地址,效果应该更好,我这里没有尝试付费

国内编程大模型地址

豆包www.doubao.com/

通义灵码lingma.aliyun.com/

deepseekdeepseek.com/

自测豆包对于AI代码编程支持较好,泛化能力也强,支持你出传入链接、图片、github仓库、代码文件夹等,对于基础代码建议使用豆包就可以

国外编程大模型推荐

claudeclaude.ai/new

geminigemini.google.com/

chatgptchatgpt.com/

国外这些大模型整体效果更高一点,尤其是 claude对于完整代码库、长文档解析,适合复杂项目的代码逻辑梳理 GitHub Copilot cursor 付费模式均支持 claude大模型,生成效果比较好

gemini的多模态生成比较好,尤其在 "根据截图生成前端代码""识别图表并生成数据分析代码" 等场景表现突出,当然你得 图生代码完全可以交给他来搞

结尾

以上就用AI提效的流程汇总,可酌情取用

相关推荐
mapbar_front3 小时前
react项目开发—关于代码架构/规范探讨
前端·react.js
二木一夕3 小时前
Vue 3 的组合式 API和传统选项式 API区别(vue2转vue3,两者差异)
前端
LuckySusu3 小时前
【vue篇】Vue 项目中的静态资源管理:assets vs static 终极指南
前端·vue.js
LuckySusu3 小时前
【vue篇】Vue.delete vs delete:数组删除的“陷阱”与正确姿势
前端·vue.js
LuckySusu3 小时前
【vue篇】Vue 模板编译原理:从 Template 到 DOM 的翻译官
前端·vue.js
小菜摸鱼3 小时前
Node.js + vue3 大文件-切片上传全流程(视频文件)
前端·node.js
LuckySusu3 小时前
【vue篇】Vue 2 响应式“盲区”破解:如何监听对象/数组属性变化
前端·vue.js
LuckySusu3 小时前
【vue篇】Vue Mixin:可复用功能的“乐高积木”
前端·vue.js
洋不写bug4 小时前
前端环境搭建,保姆式教学
前端