一篇文章,带你了解CodeTour与入门指导

news2025/7/18 8:32:20

CodeTour(代码之旅)是微软官方开发的 VS Code 扩展,允许记录和回放代码的演练和思路。

简介

CodeTour 是一个 VS Code 插件,允许记录和回放代码库的演练和思路。我们通常都是通过代码注释或者文档来解释某段代码或方法的功能及逻辑,这样的方法相对简便,但是对阅读的人来说还不够友好,CodeTour 允许我们为代码添加备注,并且将这些备注串联起来,动态地展示我们的思路以及代码逻辑。

就像一个目录,可以轻松地加入到新的项目/功能,并且可视化错误报告或了解代码审查/PR 更改的上下文。"code tour"只是一系列交互步骤,每个步骤都与特定目录或文件/行进行关联,并包括对相应代码的描述。开发人员可以 clone 一个仓库,然后立即开始学习,而无需参考 CONTRIBUTING.md 文件或依赖他人的帮助。

CodeTour 是一个 Visual Studio Code 扩展,它允许您录制和播放代码库的引导式演练。它就像一个目录,可以更轻松地加入(或重新加入!)到新的项目/功能区域,可视化错误报告,或理解代码审查/PR更改的上下文。“代码导览”只是一系列交互式步骤,每个步骤都与特定目录或文件/行相关联,并包含相应代码的描述。这允许开发人员克隆存储库,然后立即开始学习它,而无需参考文件和/或依赖他人的帮助。游览可以签入存储库,以便与其他贡献者共享,也可以导出到“游览文件”中,该文件允许任何人重播相同的游览,而无需克隆任何代码来执行此操作!

项目地址:https://github.com/microsoft/codetour

入门

录制

单击树视图中的 + 按钮 CodeTour(如果它可见)或运行 CodeTour: Record Tour 命令。这将启动 CodeTour并输入此处编辑者的名字,这时候我们可以开始打开文件,单击要注释的行的“注释栏”,然后添加相应的描述。添加任意数量的步骤,完成后,单击停止。

录制时,CodeTour 树状视图将显示当前录制的预览,以及当前的一组步骤。可以知道当前正在进行哪个 tour 的录制。

 如果需要在录制时编辑或删除步骤,单击 ... 步骤描述旁边的菜单,然后选择适当的操作,也可以从 CodeTour 树视图中查找编辑/删除步骤。

工作区

在录制时,系统会要求选择要将 tour 文件保存到的文件夹。这是必要的,因为 tour 作为文件写入工作区,需要明确 tour 应保存到哪个文件夹。

步骤标题

默认情况下,CodeTour 树使用以下显示名称格式显示每个游览步骤:

# 步骤-文件名
#<stepNumber> - <filePath>
  1. 右键单击 CodeTour 树中的步骤并选择 Change Title

  2. 支持 Markdown 语法,可以使用任何标题级别。例如,如果添加一个描述以 ### Activation 开头的步骤,步骤和树视图将如下所示:

选择文本

默认情况下,每个步骤都与创建注释的代码行相关联,但是,如果想调出特定范围的代码作为步骤的一部分,只需在添加步骤之前突出显示代码(单击 Add Tour to Step 按钮),所选内容将作为步骤的一部分被捕获。

调整录制步骤

在录制时,添加的每个新步骤都将附加到录制的末尾,可以通过执行以下操作之一按顺序上下移动现有步骤:

  • 将鼠标悬停在 CodeTour 树中的步骤上,然后单击向上/向下箭头图标
  • 右键单击 CodeTour 树中的步骤并选择 Move Up 或 Move Down 菜单项
  • 单击 ... 步骤注释 UI 中的菜单,然后选择 Move Up 或 Move Down

如果想在录制中间添加一个新步骤,只需导航到要在其后插入新步骤。

代码块

可以将 Markdown 代码块添加到步骤的正文内容,则 CodeTour 播放器将 Insert Code 在其下方呈现一个链接,该链接允许查看器自动将代码片段插入当前文件中与步骤关联的行,使得 CodeTour 创建交互式教程或示例变得容易。

Shell 命令

为了更简单地将 shell 命令嵌入到一个步骤中(例如执行构建、运行测试、启动应用程序),CodeTour 支持一个特殊的 >> 符号,在后面紧跟想要运行的 shell 命令(例如 >> npm run compile)。这将被转换为一个超链接,当点击该链接时,将启动一个新的集成终端并运行指定的命令。

开启 Tour

要开始预览,只需打开包含一个或多个 tour 的代码库。通过以下任意一种方法都可以开始一个 tour:

 在活动选项卡的 CodeTour 视图中选择 Explorer

运行CodeTour: Start Tour 命令,然后选择想启用的 tour

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/6750.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【Linux】权限管理-权限的概念,umask,粘滞位

文章目录shell命令以及运行原理Linux权限的概念用户间的权限切换su和su -的区别仅提升当前指令的权限Linux权限管理文件访问者的分类(人)文件类型和访问权限&#xff08;事物属性&#xff09;文件权限值的表示方法字符表示方法8进制数值表示方法文件访问权限的相关设置方法改变…

前端项目中资源请求顺序和dom结构顺序不一致,资源启动器有(索引)解析器和脚本

红色框资源是在组件1中 绿色框资源是在组件2中 在页面 DOM 结构中组件顺序是&#xff0c;从上到下&#xff1a;组件1->组件2 但是查看 chrome调试工具的网络请求&#xff0c;发现绿色资源先请求&#xff0c;并且像是请求完才会去请求红色资源&#xff0c;它们启动器那一栏…

C++语法——make_heap、push_heap、pop_heap、sort_heap使用介绍

目录 一.make_heap(...) 二.push_heap(...) 三.pop_heap(...) 四.sort_heap(...) 这三个函数位于<algorithm>头文件中。 可以看这篇文章了解堆排序&#xff1a;手把手教你堆排序 一.make_heap(...) 这是该函数的官方定义&#xff1a; 这个函数用于建立堆。 前两个…

Linux日志管理logrotate日志轮转

文章目录 前言 日志轮转简介 工作原理 配置文件种类 观察主文件和子文件 主配置文件介绍 yum日志轮转示例 配置轮转规则 rotate 3演示 总结 前言 上篇文章学习了系统日志管理&#xff0c;对于日志来讲他是占内存的&#xff0c;当有大量的日志产生的时候&#xff0c;会…

一个简单HTML5期末考核大作业,学生个人html静态网页制作代码

&#x1f389;精彩专栏推荐 &#x1f4ad;文末获取联系 ✍️ 作者简介: 一个热爱把逻辑思维转变为代码的技术博主 &#x1f482; 作者主页: 【主页——&#x1f680;获取更多优质源码】 &#x1f393; web前端期末大作业&#xff1a; 【&#x1f4da;毕设项目精品实战案例 (10…

m基于PSO粒子群优化的第四方物流的作业整合算法matlab仿真,对比有代理人和无代理人两种模式下最低运输费用、代理人转换费用、运输方式转化费用和时间惩罚费用

目录 1.算法概述 2.仿真效果预览 3.核心MATLAB程序 4.完整MATLAB程序 1.算法概述 粒子群优化 (PSO)算法是通过模拟鸟群觅食过程中的迁徙和群聚行为而提出的一种基于群体智能的全局随机搜索算法。PSO是将群体(swarm)中的个体看作是在D维搜索空间中没有质量和体积的粒子(part…

Paddle入门实战系列(一):基于PaddleOCR的车牌识别

✨写在前面&#xff1a;强烈推荐给大家一个优秀的人工智能学习网站&#xff0c;内容包括人工智能基础、机器学习、深度学习神经网络等&#xff0c;详细介绍各部分概念及实战教程&#xff0c;通俗易懂&#xff0c;非常适合人工智能领域初学者及研究者学习。➡️点击跳转到网站。…

MySQL十秒插入百万条数据

mysql数据库准备 private String Driver "com.mysql.cj.jdbc.Driver";private String url "jdbc:mysql://localhost:3306/mp?serverTimezoneAsia/Shanghai&rewriteBatchedStatementstrue";private String user "root";private String pa…

Pycharm 翻译插件失效(transaction) 问题解决【包括安装视频教程】

嗨害大家好鸭&#xff01;我是小熊猫❤ 最近有很多朋友反应 翻译插件用不了了(不想看文章的朋友 可以直接点击文章最下方QQ群 领取视频版教程) 那么今天&#xff01;&#xff01;&#xff01; 教大家如何快速解决这个问题 点击文件(file) —> 设置(setting) 点击工具(t…

【附源码】计算机毕业设计JAVA家庭园艺服务平台

项目运行 环境配置&#xff1a; Jdk1.8 Tomcat8.5 Mysql HBuilderX&#xff08;Webstorm也行&#xff09; Eclispe&#xff08;IntelliJ IDEA,Eclispe,MyEclispe,Sts都支持&#xff09;。 项目技术&#xff1a; Springboot mybatis Maven Vue 等等组成&#xff0c;B/…

【Node.js】 第四章 模块化

目录 1. 模块化的概念 1.1 模块化的概念 1.2 模块化规范 2. Node.js中的模块化 2.1 模块分类 2.2 模块加载 2.3 模块作用域 2.4 向外共享模块成员 2.5 exports对象 2.6 Node.js中的模块化规范 1. 模块化的概念 1.1 模块化的概念 按照模块指定规则&#xff0c;把一…

什么是智能合约?新手入门指南

智能合约&#xff0c;也称为数字合约&#xff0c;在计算机网络中使用区块链技术来履行预编程的合约当合同的条件得到满足时&#xff0c;智能合同就会执行&#xff0c;例如向合同的一方发送付款。 智能合约之所以具有吸引力有多种原因&#xff1a; 不信任。由于智能合约及其条…

【c++ 】 对象与类中方法的调用关系。类中常方法,普通方法,静态方法之间互相的调用关系

对象与类中方法的调用关系。类中常方法&#xff0c;普通方法&#xff0c;静态方法之间互相的调用关系1.对象与方法之间的调用1.常对象只能调用常成员方法2.普通对象既可以调用普通成员方法&#xff0c;也可以调用常成员方法&#xff0c;当两个同名的常成员方法和普通成员方法重…

你安全吗?丨秦淮到底是哪种黑客?你猜对了吗?

作者&#xff1a;黑蛋 大家都知道黑客&#xff0c;但是黑客也分很多种类&#xff0c;那么秦淮属于哪种黑客呢&#xff0c;我们先来看一看黑客的种类&#xff1a; 1、白帽黑客&#xff1a;白帽黑客是指通过实施渗透测试&#xff0c;识别网络安全漏洞&#xff0c;为政府及组织工…

蓝桥杯入门即劝退(九)罗马数字

“为什么你没有变强&#xff0c;因为你最近一直过得太舒服” ----------持续更新蓝桥杯入门系列算法实例------------- 如果你也喜欢Java和算法&#xff0c;欢迎订阅专栏共同学习交流&#xff01; 你的点赞、关注、评论、是我创作的动力&#xff01; -------希望我的文章对你有…

数字孪生3d智慧核电可视化场景应用展示,包括:智能计算,智能运维

最近几年来&#xff0c;数字孪生技术已被应用于核电领域&#xff0c;并且国内已有一些公司在具体实践过程中&#xff0c;通过数字孪生赋能核电更加经济、灵活、高效运维。 北京智汇云舟科技有限公司成立于2012年&#xff0c;专注于创新性的“视频孪生&#xff08;实时实景数字孪…

c++ 正则表达式

文章目录正则表达式基本语句regex_matchregex_searchregex_token_iteratorregex_replace示例匹配电话号码匹配QQ号码匹配IP地址正则表达式 什么是正则表达式&#xff1f; 正则表达式(regular expression)描述了一种字符串匹配的模式&#xff08;pattern&#xff09;&#xff0…

GENERALIZATION THROUGH MEMORIZATION: NEAREST NEIGHBOR LANGUAGE MODELS

Abatract 我们引入了kNN-LMs&#xff0c;它扩展了一个预先训练的神经语言模型&#xff08;LM&#xff09;&#xff0c;通过与k个最近邻&#xff08;kNN&#xff09;模型线性插值。最近邻是根据预先训练好的LM嵌入空间中的距离进行计算的&#xff0c;并可以从任何文本集合中提取…

45-命令行基础操作

45-命令行基础操作LInux命令行基础LInux命令基础知识Linux的Gul与CLI为什么使用Linux命令行Linux命令语法格式Linux命令分类LInux基础命令登录命令电源管理命令电源命令1: shutdown电源命令2: halt电源命令3: reboot文件管理命令Linux文件目录结构(1)Linux文件路径帮助命令目录…

Vue+Vite+TS

目录#、基础配置1、安装Node.js2、修改npm镜像源3、配置vscode一、创建项目二、Ref全家桶三、computed计算属性js中数组使用的高阶函数四、watch监听器#、基础配置 1、安装Node.js 下载地址&#xff1a;https://nodejs.org/zh-cn/download/ 安装成功&#xff0c;查看版本node …