一、VS Code介绍
(一)软件介绍
Visual Studio Code(简称VS Code)是由Microsoft开发的免费开源代码编辑器,适用于Windows、macOS和Linux操作系统。它支持多种编程语言,如JavaScript、Python、C++等,并且拥有丰富的插件生态系统,可以满足开发者的各种需求。
官方介绍文档:Visual Studio Code 文档
(二)功能介绍
VS Code具有强大的代码编辑功能,包括语法高亮、智能代码补全、代码片段、调试支持等。它还集成了版本控制工具(如Git),允许开发者直接在编辑器中进行版本管理操作。
(三)优势介绍
- 跨平台性: 支持Windows、macOS和Linux,确保开发者在不同操作系统下的一致体验。
- 轻量化: 相比较其他IDE,VS Code占用资源少,启动快速,适合于各类项目的开发。
- 丰富的扩展: 内置丰富的插件市场,开发者可以根据需求选择安装各种功能扩展,如语言支持、主题等。
(四)常见用法介绍
开发者可以使用VS Code进行日常的代码编写、调试和版本控制。通过安装适当的插件,可以定制编辑器的外观和功能,使之符合个人习惯和项目需求。常见的用法包括但不限于:
- 编写和编辑代码文件
- 调试代码
- Git版本控制
- 代码片段和自定义代码模板
(五)高阶用法介绍
高阶用法包括了解和使用VS Code更深层次的功能和技巧,例如:
- 自定义任务和构建: 使用任务运行器自定义和运行任务,如自动化构建、测试等。
- 远程开发: 使用远程扩展包,通过SSH或者容器远程访问和开发代码。
- 集成调试器: 配置和使用不同语言的调试器,以实现更高效的代码调试。
总之,Visual Studio Code作为一款开源的轻量级代码编辑器,不仅拥有基础的代码编辑功能,还通过丰富的插件生态和强大的扩展性,满足了开发者在日常工作中的多样化需求,是当前广泛应用于软件开发领域的主流工具之一。
二、VS Code基础知识
(一)VS Code的下载指南
(1)浏览器搜索对应的官网,点击进行下载即可(免费使用)
官网链接:Visual Studio Code - Code Editing. Redefined
(2)选择对应的版本直接安装即可,一直点确定即可下载完成
ps:注意点1:“浏览按需选择自己要设置的安装路径位置,为了后期的稳定性,切勿使用中文路径。
注意点2:不同版本介绍:
文本 | 文本解释 |
---|---|
User Installer | 默认安装在当前计算机帐户目录,如果使用另一个帐号登陆计算机将无法使用别人安装的vscode。vscode默认提供的为User Installer |
System Installer | 安装在非用户目录,例如C盘根目录,任何帐户都可以使用。 |
注意点3:添加到PATH一定要勾选,很重要!
(3)下载之后打开的页面如下图所示
(二)VS Code的页面介绍
(1)VSCode界面简介
VS Code 采用通用的用户界面和左侧的资源管理器布局,显示您可以访问的所有文件和文件夹,右侧的编辑器显示您打开的文件的内容。
关于对上图界面的区域解释:
区块颜色 | 区块名称 | 区块作用 |
---|---|---|
红色 | 活动栏 | 位于最左侧,可让您在视图之间切换,并为您提供额外的特定于上下文的指标,例如启用 Git 时传出更改的数量。 |
绿色 | 侧栏 | 包含不同的视图,例如资源管理器,可在您处理项目时为您提供帮助。 |
粉色 | 状态栏 | 有关已打开项目和您编辑的文件的信息。 |
紫色 | 面板 | 您可以在编辑器区域下方显示不同的面板,用于输出或调试信息、错误和警告或集成终端。面板也可以向右移动以获得更多垂直空间。 |
白色 | 编辑区 | 进行编辑文件的主要区域。您可以垂直和水平并排打开任意数量的编辑器。 |
黄色 | 菜单栏 | VSCode的各项操作 |
动栏简单介绍 | 作用 |
---|---|
编辑器打开的文件 | |
全局搜索 | |
Git管理 | |
Debug | |
插件安装 | |
用户登录 | |
VSCode设置 |
(2)VSCode设置中文界面(汉化包)
因为我们此时安装的VSCode还是英文界面,对于英语不是那么好的小伙伴不是十分友好,所以我们此时需要安装一个插件来对VSCode进行中文化处理。
1)经过如上对VSCode界面基本的了解,我们在活动栏区域找到插件安装这个选项。
2)单击它,在搜索框中搜索Chinese 选择第一个即可,选择Install进行安装。
安装完毕,右下角会弹出如下提示框,单击Restart重启VSCode即可完成。
(3) VSCode个性化设置
找到设置,选择颜色主题,会弹出如下框选,此时我们根据自己的喜好选择即可,如果你觉得没有,还可以选择浏览其他颜色主题进行预览选择。
活动栏的VSCode设置,我们在常用设置,设置字体大小,字体,是否自动保存等常用的设置项目,此处按需选择设置即可。
(4)快捷键
为了大家更为方便的使用快捷键,我再次列了一个表格进行规整化说明。
(三)插件安装
1. GitLens:让你不需要去到 Git也能自动上传coding,查看历史记录,还有谁改过哪一段编码
2. Bracket Pair Colorizer: 个人觉得超方便的工具,每次看coding久了会看到眼花花?就打开这个extension帮每个大刮号跟小括号上色,一眼就看到每个开头和结尾在哪里(温馨提示,建议用暗色系列,白色系列更伤眼了)
3.ESLint:每次写JavaScript Typescript 都有几个小错误?打开这个自动帮你检测就行了哦,一秒都不需要
4. Prettier:这个应该不用我多说了吧,整理coding的必备道具之一
5. Live Share:团队做web project 时除了用git还可以用这个插件互相查看最新进度
6. Code Spell Checker:有时候打错一个字就要花很长时间找出来?打开它,打开它,打开它!
7. C#插件:Software engineer 必备
9. Auto Close Tag:有时候不小心删掉close tag了,如果website有地方一直出不来,不如试试这个。
三、通义灵码使用
安装步骤如上所示,安装的插件名如下所示:
(一)功能介绍
(1)行级/函数级实时续写
根据当前语法和跨文件的代码上下文,实时生成行、函数建议代码。
(2)自然语言生成代码
通过自然语言描述你想要的功能,可直接在编辑器区生成代码,编码心流不间断。
(3)单元测试生成
支持根据 JUnit、Mockito、Spring Test、unit test、pytest 等框架生成单元测试。
(4)代码优化
深度分析代码及其上下文,迅速识别潜在的编码问题,从简单的语法错误到复杂的性能瓶颈,均能够指出问题所在,并提供具体的优化建议代码。
(5)代码注释生成
一键生成方法注释及行间注释,节省你写代码注释的时间,并能够有效提升代码可读性。
(6)代码解释
覆盖各种编程语言,选中代码后可自动识别编程语言并生成代码解释。跨越语言的边界,让你阅读代码更高效。
(7)研发领域自由问答
遇到编码疑问、技术难题时,一键唤起通义灵码,无需离开 IDE 客户端,即可快速获得答案和解决思路。聚焦研发领域知识的问答,帮助开发者快速解决问题。
(8)异常报错智能排查(Java)
当运行出现异常报错时,一键启动报错排查的智能答疑,可结合运行代码、异常堆栈等报错上下文,快速给出排查思路或修复建议代码。
(9)双模引擎,一键切换
支持极速离线模型(Java/Python)、云端大模型两种代码补全方式,极速离线模型拥有单行补全的能力,云端大模型具备函数生成的能力。在你需要的时候,可一键切换,满足不同网络环境、不同补全强度的场景诉求。
(二)使用指南
(1)概述
通义灵码,作为智能编码助手,可以在你进行编码工作时,为你提供行级/函数级实时续写、自然语言生成代码、单元测试生成、代码优化、注释生成、代码解释、研发智能问答、异常报错排查等辅助编码工作的功能。
(2)代码智能生成
1)行级/函数级实时续写
当你在 IDE 编辑器区进行代码编写时,在开启自动云端生成的模式下,通义灵码会根据当前代码文件及相关代码文件的上下文,自动为你生成行级/函数级的代码建议,此时你可以使用快捷键采纳、废弃、查看不同的代码建议。
2)同时,当你在编码的过程中,也可以通过快捷键 ⌥ P 手动触发生成代码建议,具体如下:
操作 | macOS | Windows |
---|---|---|
接受行间代码建议 | Tab | Tab |
废弃行间代码建议 | esc | esc |
查看上一个行间推荐结果 | ⌥(option) [ | Alt [ |
查看下一个行间推荐结果 | ⌥(option) ] | Alt ] |
手动触发行间代码建议 | ⌥(option) P | Alt P |
Tips:不同操作系统的快捷键配置可查看配置指南。
2)自然语言生成代码
通义灵码支持两种通过自然语言描述生成代码的方式:
- 在编辑器中,直接通过注释的方式描述你需要的功能,直接在编辑器中生成代码建议,单击 Tab 可直接采纳 ;
- 在智能问答中,直接描述你需要的功能,智能问答助手将为你生成代码建议,并支持一键插入或复制代码。
(3)生成单元测试、代码优化建议**、代码注释、代码解释**
1)选中代码后,一键触发功能
当你选中的代码后,支持生成单元测试、代码优化、代码注释或代码解释,有 3 种触发方式:
- 在编辑器中,单击右键找到通义灵码功能操作入口,单击对应功能操作;
- 在智能问答中,直接单击对应功能操作;
- 在智能问答中,使用 / 查看快捷指令,单击对应功能操作。
2)生成回答后,一键采纳和追问
单击对应功能操作后,在智能问答区中,通义灵码为你所选代码生成相关回答,此时你可以根据诉求进行操作,不同功能的对应操作如下:
- 生成单元测试:
- 采纳单元测试代码建议:支持一键插入、复制、或者新建代码文件,可快速采纳生成的单元测试代码建议;
- 更换单元测试框架:目前提供基于 JUnit、Mockito、Spring Test、unit test、pytest 等框架生成单元测试代码建议,在回答完成后,可以根据需要切换框架重新生成;
- 新建文件:支持一键保存单元测试代码为新文件,方便进行查看和修改。
- 生成代码优化建议
- 采纳代码优化建议:针对优化建议中的建议代码,支持一键插入、复制,快速采纳生成的建议代码;
- 查看 Diff:单击查看 Diff 按钮,将快速唤起 IDE Diff 查看窗口,快速了解建议和源代码的变更;
- 生成代码注释:
- **采纳代码注释建议:支持一键插入、复制,**可快速采纳生成的代码注释建议;
- **查看 Diff:**单击查看 Diff 按钮,将快速唤起 IDE Diff 查看窗口,快速了解建议和源代码的变更。
- 解释代码:
- 支持重试、更详细、更简单、中文/英文解释的追问。
3)函数的行间快捷入口
当需要针对一个方法或功能实现生成单元测试、代码注释、代码解释时,无需选中代码,可直接单击函数上方的快捷入口触发相关功能操作。
Tips:目前该功能 Visual Studio Code 上支持语言:Java、Python、Go、JS/TS、C/C++,JetBrains IDEs 支持语言:Java、Python。
(4)研发智能问答
使用通义灵码的智能问答时,为了通义灵码与你的对话能够更友好、高效,希望你能够在输入问题时:
- 选中代码,开始输入你的问题,通义灵码将围绕着选中代码与你开展对话;
- 精准表达问题,以及给出相对详细的上下文输入, 比如选中的代码、日志、报错信息等;
- 多多互动,告诉通义灵码,所给出代码建议或回答是否满足你的预期,或生成内容存在的具体瑕疵,通义灵码也会不断改进。
1)开始自由问答
当你编码遇到问题,缺乏具体解决思路时,可单击 IDE 侧边工具导航或使用⌘ ⇧ L唤起通义灵码智能问答助手,无需离开 IDE 客户端,即可快速获得答案和解决思路。
2)多种快捷指令问答
在智能问答输入框中,预置了多个常用快捷指令,输入 / 即可看到相关快捷指令:
- **/help:**学习如何使用通义灵码;
- **/explain code:**解释选中的代码;
- **/generate unit test:**为选中的代码生成单元测试;
- **/generate comment:**为选中的代码生成方法注释或行间注释;
- **/generate optimization:**为选中的代码生成优化建议和相关优化代码;
- **/clear context:**当你在会话中时,单击后将清空上下文记忆;
3)新建会话
在智能问答窗口中,单击右上角的新建按钮即可新建会话窗口,单击后会话窗口将会到默认状态。
4)查看会话历史
历史会话功能帮助你检索和回顾与通义灵码的交流记录,方便针对多次的建议进行对比和选择。不管你在哪个 IDE 客户端上、哪个工程中,均可以查看或搜索你和通义灵码的历史会话。
5)异常报错排查(IntelliJ IDEA)
当运行出现异常报错时,在运行标准输出窗口中,即可看到通义灵码的快捷操作按钮,单击后,通义灵码将结合运行代码、异常堆栈等报错上下文,快速给出排查思路或修复建议。
(5)IntelliJ IDEA 中技术文档和代码片段搜索
在 IntelliJ IDEA 客户端内,如果你在编码过程中有需要进行技术资料检索、代码片段搜索的诉求,无须离开 IDE,单击侧边导航的通义灵码,单击搜索,即可开始搜索。
参考引用:
[1]VSCode安装配置使用教程(最新版超详细保姆级含插件)-CSDN博客
[2]通义灵码使用教程:探索AI编码的新维度_通义灵码 visual studio-CSDN博客