前端开发神器之 VsCode AI 辅助插件 DevChat

目录

前言

我们都有过写代码时反复看了半天也不知道bug在哪,大大浪费了时间。一些基础的代码可能看一会儿能够解决,但是复杂的代码就要花上一二个小时去检查,甚至更久。如果有个AI工具,可以帮助我们搞定基础代码,复杂的逻辑给我们提供给逻辑,那岂不是更好啦。本文给大家介绍一款VsCode AI辅助工具-DevChat,开发效率直接翻倍!

DevChat介绍

DevChat 提供了辅助指令以及多种大模型,并且支持GPT4.0哦。该插件具有以下优势:

  • 手动控制提示

    对上下文的精确控制是有效使用人工智能的关键。DevChat 将控制权交给用户,以实现真正的生产力,并提供用户友好的方法来简化上下文选择。在实践中,用户仍然是占主导地位,只有在明确的要求和适当的背景下,人工智能才能真正有效。

  • 上手简单

    您不必学习特定编程语言的新框架来扩展人工智能以满足您的需求。 提示应该对用户可见且易于编辑,而不是隐藏在复杂的框架中。您不需要复杂的框架来让人工智能为您服务。所需要的只是一个在您的文件系统上运行的标准编辑器。

  • 实用

    利用人工智能编码能力的瓶颈在于如何在提示中嵌入正确的上下文,仅当人工智能真正增加价值时才使用它。

官方地址:https://meri.co/tvy

安装

打开VsCode开发工具,在应用市场搜索DevChat,然后点击install

安装完之后就可以在侧边栏有个类似小兔子图标,点击之后就可以看到插件的视图

设置密钥访问

插件需要密钥访问,密钥是在注册时发送到邮箱里的。

DevChat账号注册地址:链接直达

在 Visual Studio Code 中按 ⇧⌘P / Ctrl+Shift+PF1 打开命令面板。接下来,输入devchat access key并输入上面的访问密钥。注意不要忘记安装Python 3.8+和Git来使用 DevChat。

然后输入邮箱里的key就可以啦

之后就可以正常使用啦!

指令

DevChat提供了下面的指令,方便了我们在开发时的操作以及对代码的分析。

  • 自定义本地命令
    单击此项并输入您想要的命令以运行。返回将被添加到上下文中。
  • git diff --cached
    自上次提交以来已暂存的更改
  • git diff HEAD
    自上次提交以来的所有更改
  • git log for release note
    自指定提交以来的格式化提交历史记录
  • symbol definitions
    在所选代码中查找类、函数等的相关定义
  • symbol references
    查找引用所选符号(类、函数、变量等)的代码站点

比如我要分析下面的代码:

javascript 复制代码
let transAudioData = {
  transcode(audioData) {
    let output = transAudioData.to16kHz(audioData)
    output = transAudioData.to16BitPCM(output)
    output = Array.from(new Uint8Array(output.buffer))
    self.postMessage(output)
    // return output
  },

选择symbol references之后,可以看到控制台中的OUTPUT输出一段JSON。

将图中的字符串转JSON之后如下:

javascript 复制代码
{
    "languageId": "javascript",
    "path": "../study-demo/kedaxunfei/src/until/transcode.worker.js",
    "startLine": 6,
    "content": "  transcode(audioData) {\r\n    let output = transAudioData.to16kHz(audioData)\r\n    output = transAudioData.to16BitPCM(output)\r\n    output = Array.from(new Uint8Array(output.buffer))\r\n    self.postMessage(output)"
}

AI 解疑

DevChat提供了图中8种AI模型,根据需求选择其中一种进行对话操作。

我们可以直接向DevChat输入需求,让其帮助我们进行解答。

当然,如果我们在编辑器中有部分代码有疑惑,可以右键选择Add to AddChat,然后在左侧对话框输入我们的问题。

比如,编辑器中我对下面的代码有疑惑,然后询问DevChat帮我解答疑惑。

javascript 复制代码
  resolve: {
    alias: {
      '@': path.resolve(__dirname, 'src'),
      'components': path.resolve(__dirname, 'src/components'),
    },
    extensions: ['.js', '.json', '.ts', '.vue'], // 使用路径别名时想要省略的后缀名,可以自己 增减
  },

可以看到当点击Add to AddChat后,左侧输入框就多个图标内容,主要记录的是你的操作。


DevChat进行解答,这种形式不需要我们通过搜索引擎去搜索问题答案,真的是太高效了!

最后

体验之后,真的感受到人工智能的强大。提高开发效率是每一位程序猿的综合素养。在互联网降本增效的时代,希望我们每位程序猿都能顺应潮流,更高效地工作,减少无用功,将自身价值发挥到有意义的地方!

相关推荐
沐沐沐沐沐沐9 分钟前
图像认知与OpenCV | Day5:图像预处理(4)
人工智能·opencv·计算机视觉
一水鉴天10 分钟前
关于“PromptPilot” 之3 -Prompt构造器核心专项能力:任务调度
人工智能
陈敬雷-充电了么-CEO兼CTO11 分钟前
强化学习三巨头PK:PPO、GRPO、DPO谁是大模型训练的「王炸」?
人工智能·python·机器学习·chatgpt·aigc·ppo·grpo
Wendy144114 分钟前
【图像噪点消除】——图像预处理(OpenCV)
人工智能·opencv·计算机视觉
大江东去浪淘尽千古风流人物14 分钟前
【prompt】Lyra 提示词深度研究
人工智能·prompt
Adorable老犀牛25 分钟前
AI×运维:从“救火队员”到“预见者”的涅槃:智启下一代IT运维的无限可能
运维·人工智能·aiops
coder_pig28 分钟前
👦抠腚男孩的AI学习之旅 | 3、AI-概念名词 & LLM-模型微调
人工智能·aigc·ai编程
竹子_231 小时前
《零基础入门AI:传统机器学习核心算法解析(KNN、模型调优与朴素贝叶斯)》
人工智能·算法·机器学习
星月昭铭2 小时前
Spring AI集成Elasticsearch向量检索时filter过滤失效问题排查与解决方案
人工智能·spring boot·spring·elasticsearch·ai
一点一木2 小时前
🚀 2025 年 07 月 GitHub 十大热门项目排行榜 🔥
前端·人工智能·github