分享8个提升VScode开发效率的小技巧

分享8个提升VScode开发效率的小技巧

vscode的免费,开源,轻量,快速,强大,智能提示已经让它火遍了全球。本篇文章就来让我们来学习一下VScode的八个提升开发效率的小技巧,让你的开发效率up up up!

1. 按下ctrl+K,再按下ctrl+S,查看快捷键列表。

分享8个提升VScode开发效率的小技巧

如果你想查看某个操作的快捷键,你并不用去看官方文档,只需要调出快捷键列表,在上方搜索栏搜索你想要的操作,即可获知对应的快捷键组合。

2. 按下ctrl+P,弹出搜索栏,直接输入关键字,在所有文件中搜索特定符号:

分享8个提升VScode开发效率的小技巧
在所有文件内搜索”employee”关键字

在搜索栏前输入”@“,在当前文件中搜索特定符号:

分享8个提升VScode开发效率的小技巧
在当前打开文件中搜索”employee“关键字

在搜索栏前输入”>“,搜索所有可使用的命令 比如我想使用spring initializr扩展的命令, 创建一个Maven工程:

分享8个提升VScode开发效率的小技巧
搜索”spring initializr:Generate a Maven Project”命令

3. 在阅读代码的时候,常常需要在不同的文件间切换,这时会出现“看了这个忘了那个”的现象,我们可以在插件市场中下载Bookmarks插件,助你更快标记、寻找某块代码。

分享8个提升VScode开发效率的小技巧

运用第二条的知识,ctrl+P,再输入”>”,输入插件名,查看该插件的命令:

分享8个提升VScode开发效率的小技巧
标记图中36-38行代码

选择命令Toggle Labeled(标记并给该标记命名),为其命名“getId”后,当我们在别的文件中时,我们可以直接搜索该标签,跳转至标记处~

分享8个提升VScode开发效率的小技巧
   选择Bookmarks:List from All Files 陈列出你的标签        

分享8个提升VScode开发效率的小技巧

看到了我们刚才标记的代码块~Enter键直接跳转~

推荐学习:《vscode教程》

4. 对某个函数或变量,右键点击,在不移动目前代码位置的前提下,查看其定义和引用。

分享8个提升VScode开发效率的小技巧
右键,点击peek definition        

分享8个提升VScode开发效率的小技巧 
弹出该属性的定义

同理,还可以看这个函数或变量在哪里被引用:选择”peek reference“

分享8个提升VScode开发效率的小技巧
查看变量的引用位置      

  分享8个提升VScode开发效率的小技巧 
弹出变量的引用位置

5. 通过ctrl+=和ctrl+-组合来进行缩放。

当你觉得现在的字体有点小,看不清,或者有点大,你不必去在设置菜单栏里面绕个晕头转向,你只需用如上两个组合键来进行缩放即可。

分享8个提升VScode开发效率的小技巧
放大     

   分享8个提升VScode开发效率的小技巧
缩小

6. 使用Paste Json As Code扩展,将复制黏贴来的json文件直接序列化成代码。

分享8个提升VScode开发效率的小技巧

举例:

将如下json文件:

分享8个提升VScode开发效率的小技巧        
json文件

序列化为Java代码:

小微助手 小微助手

微信推出的一款专注于提升桌面效率的助手型AI工具

小微助手 47 查看详情 小微助手

分享8个提升VScode开发效率的小技巧

直接打开命令板,输入Paste Json As Code的命令即可,十分方便。

7. 使用安装量高达一千两百万的Gitlens扩展,助你更好地进行代码合作,查看代码更改历史。

分享8个提升VScode开发效率的小技巧

结合GitLens,你从github上clone下来的代码上就会出现代码作者,代码commit的具体时间:

分享8个提升VScode开发效率的小技巧
可以看到作者Greg Turnquist在三件前对改代码做了commit

点击右上角新出现的“Toggle File Blame Annotation”按钮,对比展示你的代码与原repo的区别:

分享8个提升VScode开发效率的小技巧
点击改图标      

  分享8个提升VScode开发效率的小技巧
查看你更改后的与原版本代码的区别

分割线左侧是原repo,右侧是我们更改后的代码,我们可以看到具体的代码作者和commit时间。

在左侧的action bar中,新出现了GitLens的图标,点击后,详细查看branch,master,commit的信息:

分享8个提升VScode开发效率的小技巧

可以看到当前repo的整个commit历史,作者的github头像也能看到,点击某个修改历史,直接就可以看到该修改和修改前代码的所有区别。

8. 压轴出场:微软主打的革命性开发扩展:VS Live Share,在这个扩展的加持下,你可以和你的同事完成真正的远程实时代码协同开发,对方并不需要将整个工程clone下来,只需要连接到你开的session,你和他就可以对一个文件进行开发,修改。

Visual Studio Live Share enables you to collaboratively edit and debug with others in real time, regardless what programming languages you’re using or app types you’re building. It allows you to instantly (and securely) share your current project, and then as needed, share debugging sessions, terminal instances, localhost web apps, voice calls, and more! Developers that join your sessions recieve all of their editor context from your environment (e.g. language services, debugging), which ensures they can start productively collaborating immediately, without needing to clone any repos or install any SDKs.  VS live share 让你可以实时与你的合作者协同编辑,调试代码,不管你是在使用何种语言,开发何种应用。它让你可以实时并安全地分享你的当前工程,并且如果需要,甚至可以分享调试会议,命令行示例,本地web应用,语音通话,甚至更多!参加会议的开发者可以从你的环境中接收到所有的编辑内容(比如语言服务,调试),确保参会者可以高效合作,无需克隆项目代码并安装开发包。

分享8个提升VScode开发效率的小技巧

使用起来很容易,安装该扩展:

分享8个提升VScode开发效率的小技巧

enable该扩展,reload你的VScode,然后看到左下角的Live Share图标:

分享8个提升VScode开发效率的小技巧

跳转至浏览器页面:

分享8个提升VScode开发效率的小技巧

使用我们的GitHub账号登陆(也可以用微软账号)。

随后回到我们的VS live share界面中,可以看到:

分享8个提升VScode开发效率的小技巧        
实时代码沙龙

只有我一个人,那如何让别人也参与进来呢?

分享8个提升VScode开发效率的小技巧        
点击该图标

每一个举办的实时代码会议,都有一个网址,也就是url地址,点击这个按钮,该地址会自动进入你的剪贴板中,你只需把这个url发送给你的同事,你的同事在浏览器中进入这个网址:

分享8个提升VScode开发效率的小技巧

可以看到这个代码实时会议是我开的,然后直接点击自动弹出的Open Live Share for VS Code,你的VScode就会自动启动,打开之后,你已经进入了该代码实时会议,可以和大家开始共享整个工程,甚至可以用voice call和他们实时语音交流,共同享受代码协作开发的乐趣。

更多编程相关知识,请访问:编程视频!!

以上就是分享8个提升VScode开发效率的小技巧的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/503464.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年11月8日 21:24:22
下一篇 2025年11月8日 21:25:04

相关推荐

  • 上外边距未生效

    标题:探究margintop失效的原因及解决方法 导言:在进行网页设计或者开发过程中,经常会遇到某些元素的margintop属性失效的情况,造成布局上的问题。本文将探究margintop失效的原因,并提供解决该问题的具体代码示例。 一、margintop属性失效的可能原因 盒模型问题:当元素的盒模型…

    2025年12月24日
    000
  • 深度剖析程序设计中必不可少的数据类型分类

    【深入解析基本数据类型:掌握编程中必备的数据分类】 在计算机编程中,数据是最为基础的元素之一。数据类型的选择对于编程语言的使用和程序的设计至关重要。在众多的数据类型中,基本数据类型是最基础、最常用的数据分类之一。通过深入解析基本数据类型,我们能够更好地掌握编程中必备的数据分类。 一、基本数据类型的定…

    2025年12月24日
    000
  • 纯CSS与HTML网格布局优化:精简冗余代码的策略

    本教程探讨了在纯CSS和HTML环境中,如何优化重复性极高的网格布局代码。针对一个13×13的矩阵设计,我们提出了两种主要策略:一是通过JavaScript将网格数据编码为字符串并动态生成DOM元素,大幅减少HTML冗余;二是在严格限制纯HTML/CSS时,利用SVG的路径绘制能力,以矢量…

    2025年12月23日
    000
  • GemBox.Document HTML转PDF垂直文本渲染问题及解决方案

    本教程旨在解决使用gembox.document将包含css `writing-mode`属性的html转换为pdf时,垂直文本未能正确显示的问题。核心解决方案是升级gembox.document库至支持该属性的最新热修复版本,以确保html中定义的垂直布局在pdf输出中得到精确还原,提升文档转换的…

    2025年12月23日
    000
  • 生成的html代码怎么在记事本运行_记事本运行生成html代码方法【教程】

    服务器IP无法解析时,可通过记事本编写HTML文件并用浏览器运行来本地测试网页:一、用记事本输入HTML代码,另存为.html文件;二、双击文件或右键选择浏览器打开;三、右键用记事本修改代码并保存后,在浏览器刷新即可查看更新内容。 如果您尝试访问某个网站,但服务器无法访问,则可能是由于服务器 IP …

    2025年12月23日
    000
  • 代码保存为html文件后怎么运行_保存后html文件运行方法【教程】

    1、直接右键HTML文件选择浏览器打开即可本地运行;2、通过浏览器菜单使用Ctrl+O加载文件;3、用VS Code等编辑器配合Live Server插件实现热更新预览;4、对于含JS/CSS外链或异步请求的项目,需用npx http-server启动本地服务器,通过http://localhost…

    2025年12月23日
    000
  • 打完代码怎么让它运行html_完成代码后运行html步骤【指南】

    首先保存HTML文件为.html格式,如index.html;然后通过双击文件或右键用浏览器打开;也可在编辑器中使用Live Server等功能实时预览;最后可创建书签或快捷方式方便重复访问。 如果您已经编写完HTML代码,想要在浏览器中查看页面效果,需要按照正确的方式打开和运行该文件。以下是将编写…

    2025年12月23日
    000
  • html代码好了怎么不在浏览器运行_禁html在浏览器运行设置【设置】

    首先检查文件是否以.html为扩展名并正确命名,接着通过浏览器地址栏输入file:///路径访问文件,然后为浏览器快捷方式添加–allow-file-access-from-files参数以解除本地文件限制,最后确认代码包含DOCTYPE声明及完整标签结构并通过W3C校验工具检测语法正确…

    2025年12月23日
    000
  • 深入解析HTML URL验证与Unicode字符处理

    本文深入探讨了W3C验证器在处理包含Unicode补充字符的URL路径时曾出现的一个特定错误。该问题源于验证器URL解析逻辑中对UTF-16编码下代理对字符(如?)的索引递减处理不当,导致其在特定相对路径(如`/?`)下被错误地标记为无效,而其他路径则正常。文章详细阐述了Unicode字符编码与UR…

    2025年12月23日 好文分享
    000
  • W3C HTML验证器中Unicode字符路径解析的深度解析与修复

    本文深入探讨了w3c html验证器在处理包含特定unicode字符(如?)的url路径时曾出现的验证错误。该问题源于验证器内部url解析逻辑对utf-16补充字符处理不当,未能正确计算字符索引。文章详细解释了java中utf-16编码与代理对的概念,以及修复方案如何通过引入character.ch…

    2025年12月23日 好文分享
    000
  • Mac用CodeRunner一键运行HTML并弹出浏览器预览

    首先安装并配置CodeRunner,创建自定义HTML Preview语言类型,设置运行命令为open $filename且不启用终端运行,接着开启自动保存功能确保代码实时生效,最后通过系统快捷键设置将Run命令绑定到Cmd+R实现一键预览。 如果您在Mac上编写HTML代码,希望借助轻量级工具实现…

    2025年12月23日
    000
  • Linux用dmenu快速启动HTML相关学习应用

    首先配置dmenu并绑定快捷键,再编写Shell脚本集中管理HTML学习工具,最后通过脚本集成浏览器文档资源快捷入口,实现一键启动应用与网页。 如果您希望通过快捷键快速启动与HTML学习相关的应用程序,但每次都需要手动查找或输入命令,可以利用dmenu结合自定义脚本实现高效访问。以下是具体操作步骤:…

    2025年12月23日
    000
  • Mac Bear标签页同时打开HTML源码和CSS样式

    Bear不支持HTML与CSS标签页式编辑,仅能通过代码块编写并导出预览,建议搭配VS Code等专业工具实现双栏实时开发。 在 Mac 版的 Bear 笔记应用中,无法直接以标签页形式同时打开 HTML 源码和 CSS 样式进行编辑。Bear 是一款专注于简洁写作的 Markdown 笔记工具,它…

    2025年12月23日
    000
  • Mac终端用file命令快速检测HTML文件编码类型

    使用file命令可快速检测Mac上HTML文件的编码类型。打开终端,输入file -I yourfile.html,查看输出中的charset字段,如charset=utf-8表示UTF-8编码;结合ls、for循环与grep可批量处理并过滤显示多个.html文件的编码信息,提升检测效率。 如果您需…

    2025年12月23日
    000
  • 手机HTML网页编辑器入口 HTML编辑器手机在线免费

    手机HTML网页编辑器入口位于https://www.tutorialspoint.com/codingground,该平台支持多语言在线编码、实时预览、无需安装、适配移动端,提供语法高亮、示例模板、多标签编辑、文件导出与分享功能,兼容安卓和iOS系统,适合初学者学习与小型项目开发。 手机HTML网…

    2025年12月23日
    000
  • HTML id 属性唯一性:深入理解与最佳实践

    html `id` 属性在整个文档中必须保持唯一。虽然非唯一 `id` 可能不会立即导致页面崩溃,但它会引发浏览器警告,并严重影响 javascript 对元素的精确操作以及 css 样式的预期应用。本文将深入探讨 `id` 唯一性的重要性、非唯一 `id` 带来的潜在问题,并提供确保前端代码健壮性…

    2025年12月23日
    000
  • 如何嵌入图片html_HTML图片嵌入(img标签/背景图)方法

    使用img标签插入内容性图片,需设置src和alt属性;2. 使用CSS background-image添加装饰性背景图,便于控制样式;3. 正确使用相对或绝对路径确保图片加载;4. 根据语义合理选择方法以提升可访问性与性能。 在网页中显示图片,常用的方法有两种:使用 img 标签 直接插入图片,…

    2025年12月23日 好文分享
    000
  • JavaScript Trivia游戏答案判断错误问题排查与修复

    本文旨在解决JavaScript Trivia游戏中答案判断始终返回第一个答案为正确的错误。通过分析问题代码,找出`checkAnswer`函数中`currentQuestion`变量的错误使用,并提供修改后的代码示例,帮助开发者理解和修复类似问题,确保Trivia游戏逻辑的正确性。 在开发Triv…

    2025年12月23日
    000
  • HTML定义列表怎么用_HTML的dl dt dd标签使用教程

    HTML定义列表()用于表示术语与定义的语义化结构,由和标签组成,适用于名称-值对内容,如词汇表、FAQ等。它在语义上优于无序或有序列表,能提升可访问性和SEO。正确使用包括一个对应多个或多个共享一个,避免用作布局工具。通过CSS可实现垂直或水平布局,并借助Flexbox和媒体查询实现响应式设计,增…

    2025年12月22日
    000
  • 优化JavaScript循环控制:使用函数进行break条件判断

    本文探讨如何在JavaScript中将for循环的break条件逻辑从循环体中分离到独立函数,以降低代码复杂度。由于break语句的上下文限制,不能直接移出循环,因此需通过让外部函数返回布尔值来指示循环是否应终止,从而实现更清晰、可维护的循环控制。 问题分析:break语句的限制 在软件开发中,为了…

    2025年12月22日
    000

发表回复

登录后才能评论
关注微信