codecamp

JavaScript AI 通义灵码 VSCode插件安装与功能详解

简介

通义灵码是由阿里云技术团队打造的智能编码助手。它基于通义大模型,能够提供:

  • 代码续写和优化
  • 自然语言描述生成代码
  • 注释生成和代码解释
  • 单元测试生成
  • 研发智能问答
  • 代码问题修复等功能。

通义灵码官网:https://tongyi.aliyun.com/lingma/

通义灵码支持:JetBrains IDEs、Visual Studio Code、Visual Studio,及远程开发场景(Remote SSH、Docker、WSL、Web IDE),安装后登录账号即可开始使用。

对于JavaScript开发者而言,最常见的开发环境就是VSCode,因此本文将介绍如何在VSCode中安装配置通义灵码,并演示其功能。

安装指南

请确保你已经安装了VSCode,本文不再赘述安装过程(详见:Visual Studio Code 入门)。 VSCode三端的插件安装方式基本一致,本文以Windows为例,介绍如何在VSCode中安装通义灵码插件。 对于VSCode而言,通义灵码的使用非常简单,只需要在VSCode中安装插件即可。

  1. 使用插件市场安装 通义灵码已上架VSCode插件市场,在VSCode中打开插件市场,搜索“​TONGYI Lingma​”即可找到插件,点击安装即可。
       通义灵码-vsc插件市场
  2. 使用插件安装包安装 单击下方链接,下载 Visual Studio Code 的 VSIX 安装包;
    ⇩ TONGYI Lingma-VS Code
    下载完成后,打开 VSCode,点击左侧的扩展图标,点击“从VSIX安装”,选择下载好的 VSIX 文件即可。
    通义灵码插件安装包
    安装完成后VSCode的左侧会多出一个通义灵码的图标,点击即可进入插件界面。
    通义灵码插件界面

    点击立即登录,同意用户协议,会跳转到登录页面。

    协议许可

    通义灵码支持多种登录方式,包括账号密码登录、手机号登录、支付宝、阿里云、淘宝、钉钉登录。
    登录方式

    登录后即可使用通义灵码的各项功能。


功能演示

代码续写

通义灵码提供了行级和函数级的代码补全功能。当你在 IDE 编辑器区进行代码编写时,在开启自动云端生成的模式下,通义灵码会根据当前代码文件及相关代码文件的上下文,自动为你生成行级/函数级的代码建议,此时你可以使用快捷键采纳、废弃,或查看不同的代码建议。

同时,当你在编码的过程中,也可以通过快捷键 ​⌥​ ​P​ 手动触发生成代码建议。

代码补全功能演示

开发小提示:为了让代码补全功能更贴近我们想要的结果,我们可以先写代码注释描述其功能。例如上图所示

编辑器中代码建议相关操作的快捷键如下:

操作 macOS Windows
接受行间代码建议 Tab Tab
废弃行间代码建议 esc esc
查看上一个行间推荐结果 ⌥(option) + [ Alt+[
查看下一个行间推荐结果 ⌥(option)+] Alt+]
手动触发行间代码建议 ⌥(option)+P Alt+P

并不是所有的代码文件都需要使用代码提示,比如在调试css的时候我们不希望出现代码提示,这时候就可以禁用行间生成

代码注释

通义灵码提供了代码注释功能,它可以根据你的代码生成对应的注释,方便代码阅读和维护。 使用代码注释需要先选中需要注释的代码,代码左上角会出现一个按钮,点击即可选择代码注释功能。

代码选中


也可以用快捷键shift+alt+V,或者右键菜单中也有代码注释功能。

会在左侧显示代码注释结果

代码注释功能

我们可以通过通义灵码给我们返回的代码块右上角的按钮进行操作。 包括插入,复制,新建和合并(diff)操作,一般注释是使用插入来把原代码替换成有注释的代码。

代码解释

代码解释与代码注释不同,注释是为了让代码更易读,而代码解释是告诉你代码为什么这么写。 与代码注释相同,选中代码后,点击通义灵码的代码解释按钮,通义灵码会根据你的代码生成对应的解释。 

代码解释功能


单元测试生成

对于软件开发而言,测试是极其重要的,甚至有测试用例先行的情况。通义灵码提供了生成代码的单元测试的功能,并告诉你为什么要测试这些用例。 与代码注释相同,选中代码后,点击通义灵码的生成单元测试代码,通义灵码会根据你的代码生成对应的单元测试代码。

它还会告诉你为什么要测试这些用例。

单元测试功能

生成的测试用例代码

单元测试功能

测试用例代码一般是复制后到一个专门的测试用例文件中,方便后续测试。也可以用新建文件,通义灵码会再帮你创建一个测试用例文件。

代码优化

单个人进行开发很难做到面面俱到,偶尔会出现一些代码遗漏的地方,比如错误处理,边界值处理和参数校验等。在团队开发中通常会存在结对编程互审代码或者团队代码 reviews。现在有了通义灵码,你可以通过通义灵码来辅助你进行代码优化,比如代码错误处理,边界值处理和参数校验等。

代码优化功能

代码优化功能

代码优化一般使用合并(diff)操作来把原代码替换成优化后的代码。

智能问答

通义灵码提供了智能问答功能,它可以对你的问题做出回答,你也可以让他进行代码创作。

智能问答功能

实际上在之前的功能中也有智能问答的展示,之前的很多功能都是基于智能问答实现的,他们只不过是在智能问答的时候输入了合适的上下文(甚至是文件),以单元测试生成为例,实际上就是向智能问答提问:这段代码的单元测试用例怎么写。

智能问答现在可以选择不同的大模型了,可以选择通千问的大模型,也可以选择时下很火的deep seek 大模型。

会话创建和清理

智能问答是一个持续对话的过程,你可以持续进行提问,但大模型也会因此记录你之前的提问信息,可能会影响后续的回答,比如你一直在问JavaScript如何使用循环,突然想了解多线程相关的内容,智能问答会认为你想了解的是JavaScript的多线程,并继续进行回答。 可以通过会话创建和清理来清理大模型记录的提问信息,你可以选择会话创建和清理,也可以选择会话清理。 清理会话:在对话框中输入/clearContext,然后点击确定即可。 创建新会话:在对话框中中输入/newTask,然后点击确定即可。

会话创建和清理


AI程序员

AI程序员是用来帮助开发者进行编码工作的,它可以通过对话的方式 根据你的需求描述和要求,对整个项目进行代码开发,代码审查和代码变更。 换句话说,现在你才是产品经理,你来指导ai进行代码开发,你可以要求ai创建一个项目

    AI程序员

也可以让ai生成一些代码

    ai程序员2

可以看见ai帮你生成了一些代码,但最后你还得自行选择是否接受他生成的代码,最终决定权还在你自己。


JavaScript 用法
JavaScript 浏览器中执行
温馨提示
下载编程狮App,免费阅读超1000+编程语言教程
取消
确定