你应该知道的11个vscode特性和技巧

SHERlocked93 SHERlocked93     2023-01-05     656

关键词:

1.带连字符的字体

在处理大型项目时,带有连字的字体使代码更干净、更方便,您可以通过结合连字的特殊字体使您的编辑器体验更好。有几种支持连字的字体可用,但您可以简单地坚持使用经典的 Fira Code

要在 VS Code 中启用连字,您只需在 VS Code 设置文件中添加**“editorLigatures”:true**。

2.彩虹缩进

如果您使用 JavaScriptPython 编写代码,则此 VS Code 扩展会为文本前面的缩进着色,每一步交替使用四种特殊颜色,那么此功能对于外观整洁的代码非常有用。

3.标签包装

如果你厌倦了重复打字那么你应该了解emmet,emmet允许你编写一个缩写的代码并快速获取返回的相应标签。最新版本的 emmet 支持大多数 Emmet 操作,包括扩展 Emmet 缩写和片段。

要使用标签包装:

  • 选择文本。

  • 打开命令面板。

  • 执行Emmet: Wrap with Abbreviation

  • 输入标签 div(或缩写)

  • 然后按 Enter

4.Turbo Console.log()

当您只需要快速输出某些内容时,您应该节省时间,而不是重复键入 console.logTurbo Console Log 是 VS Code 中一个很棒的扩展,它解决了这个问题,它可以在下面的行中记录任何变量,并在代码结构之后自动添加前缀。

5.多光标编辑

我个人喜欢 VS Code 中最有用的功能之一,通过多光标编辑,您可以快速编辑多行。多光标编辑有以下几种方法:

  • ALT-CLICK:如果你想在一个文件中插入多个不在连续行上的光标,你只需简单地按住ALT并点击每一行。

  • CTRL-U:万一你点击了错误的行,又不想重新选择行,那么只要按CTRL+U就可以撤销上次的光标操作。

  • SHIFT-ALT:用方向键。如果你选择了一个词,并希望包括引号或它附近的任何东西,只需简单地使用SHIT+ALT与方向键来扩大你的选择区域。

  • SHIFT-ALT-Drag:使用此组合键可以创建矩形选区。

6.Polacode

如果您熟悉分享源代码截图的著名工具(Carbon.sh),但所有这些工具都需要付出更多努力来构建吸引人的源代码截图。Polacode 以非常简单的方式完成相同的工作,您可以使用 Carbon 中无法使用的默认编辑器字体。

7.WakaTime(唤醒时间)

这个扩展帮助你跟踪你的指标和有关你的编程分析,你还可以查看你经常使用哪种编程语言。

8.排序

每当您想对数据或变量列表进行排序时,您只需选择要排序的行并使用命令面板 (F1),然后搜索排序。您将看到您可以选择升序或降序排序。

9.注释

添加注释是开发人员在团队中工作时经常做的事情,在 VS Code 中,您可以眨眼注释掉单行或多行。

尽管有两种方法可以添加注释。

  • 您可以通过按 CtrlCmd + / 对一行进行注释,再次按下它将取消对该行的注释。

  • 要创建注释块,请选择您想要注释的选项并按下 Shift+Alt+ A

10.自定义侧边栏

在编写代码时,您总是需要尽可能多的空间,您可以通过按 CtrlCmd + B 关闭侧边栏,也可以再次按 Ctrl 或 Cmd + B 撤消侧边栏。此外,如果你想打开它到一个特定的菜单,那么你可以使用下面给出的特定菜单的键盘快捷方式。

11.自定义片段

没有人喜欢一遍又一遍地输入相同的代码,片段扩展为我们做了这项工作。但有些时候,我们只是需要一个自定义的代码段来使我们的工作更容易。在VS Code中,你可以创建自定义代码片段,减少输入相同代码的重复。

要创建自定义代码段:

  • 转到设置图标并选择User Snippets,现在选择您想要创建的片段的语言。

  • 例如,如果您想为 JavaScript 项目创建自定义代码段。您必须编写key/value对,其中key包含定义的数据。prefix(前缀)定义了代码段的触发词,body(正文)是将要插入的代码,description(描述)是可选的,由 IntelliSense 显示。


原文:https://javascript.plainenglish.io/11-vs-code-features-tricks-you-should-know-as-a-developer-47e5ec0c362b
作者:Mohit

最后

如果你觉得这篇内容对你挺有启发,我想邀请你帮我三个小忙:

  1. 点个「在看」,让更多的人也能看到这篇内容(喜欢不点在看,都是耍流氓 -_-)

  2. 欢迎加我微信「 sherlocked_93 」拉你进技术群,长期交流学习...

  3. 关注公众号「前端下午茶」,持续为你推送精选好文,也可以加我为好友,随时聊骚。

点个在看支持我吧,转发就更好了

优雅编程|7个你应该掌握的javascript编码技巧

JavaScript是一个灵活性很强的语言,有很多和其他语言不一样的特性,本文分享7个日常开发中可以用到的JavaScript编码技巧,享受其优雅编程的快感。更多的编码技巧可以参阅《18个JavaScript代码的小技巧》和《24个Javascript代码优化... 查看详情

xcode开发者应该知道的七个使用技巧

1.快速打开快速打开(OpenQuickly)命令在Xcode的File菜单中,当然,用快捷键Command+Shift+O会更方便一些。这个命令可以开启一个小窗格用来快速搜索浏览文件、类、算法以及函数等。这个命令每天都为我节省了巨多的时间,如果你... 查看详情

学习pcl库你应该知道的c++特性

要学会PCL首先要对C++进行学习,所以这里我们首先对PCL库的代码中常见的C++的技巧进行整理和概述,并且对其中的难点进行细化讲解。首先我们搞清楚PCL库的文件形式、是一个以CMake构建的项目,库中主要... 查看详情

你应该知道的es2020中的10个javascript新特性(代码片段)

好消息–ES2020的新功能现已完成!这意味着我们现在对ES2020中发生的变化有了完整的了解,ES2020是JavaScript的新的和改进的规范。因此,让我们看看这些变化是什么。1.BigIntBigInt是JavaScript中最令人期待的功能之一,... 查看详情

关于react的这些常用技巧,你应该知道

前言大家好,我是CoderBin,本文总结了React中的一些常用技巧,相信看完本文的小伙伴都能从中有所收获 查看详情

你需要知道的30个es6—es12开发技巧!(代码片段)

大家好,我是漫步,ECMAScript版本有很多,你了解多少?一起来看看这篇文章。关注我加星标及时收到文章。又是一顿爆肝,又是一篇万字长文,重新梳理了一下ES6——ES12的常用新特性,很多特性在开... 查看详情

你可能不知道的14个javascript调试技巧(代码片段)

...少的时间来解决这些错误。我们已经列出了14个您可能不知道的调试技巧,但可能要记住,这样下次你需要调试JavaScript代码时就可以马上使用了!现在就马上开始。1.‘debugger;’除了 console 查看详情

每个开发人员都应该知道的11个linux命令(代码片段)

本文主要挑选出读者有必要首先学习的11个Linux命令,如果不熟悉的读者可以在虚拟机或云服务器上实操下,对于开发人员来说,能熟练掌握Linux做一些基本的操作是必要的!事不宜迟,这里有11个Linux命令行技巧,可以使你的生... 查看详情

第一次使用vscode时你应该知道的一切配置(代码片段)

前言本文首发于博客园。最新内容将在GitHub上实时更新。VSCode本来是前端人员专用,但由于它实在是太好用了,于是,各种开发方向的码农也正在用VSCode作为他们的主力编程工具。甚至是一些写作的同学,也把VSCode作为markdown写... 查看详情

这些linux技巧你应该知道(代码片段)

...metime-savingtipsthateveryLinuxusershouldknow?》——Linux用户有哪些应该知道的提高效率的技巧。我觉得挺好的,总结得比较好,把其转过来& 查看详情

http,http2.0,spdy,https你应该知道的一些事

原文:http://web.jobbole.com/87695/1.web始祖HTTP全称:超文本传输协议(HyperTextTransferProtocol)伴随着计算机网络和浏览器的诞生,HTTP1.0也随之而来,处于计算机网络中的应用层,HTTP是建立在TCP协议之上,所以HTTP协议的瓶颈及其优化技巧... 查看详情

你应该知道的协程中的挂起转化小技巧

...其他代码为挂起函数,让你的协程用起来更舒适.另外我们应该知道的是,协程本质上是一个线程工具.suspendCoroutine&suspendCancellableCoroutine当我们开启了一个协程,如果我们遇到了其他人写的代码或者某 查看详情

matlab|那些你不得不知道的matlab小技巧(代码片段)

1:实时脚本控件实时脚本应该大部分人都会用了,但是实时脚本控件应该用的人还不多,怎么说呢,应该算一个更方便调整参数的模块叭。点击图示按钮即可插入各种类型的控件:插入之后双击控件即可设置其属... 查看详情

四两拨千斤——你不知道的vscode编码typescript的技巧

如果你体验过JAVA这种强类型语言带来的便利,包括其丰富的类型变量、抽象与接口,转而使用JavaScript时,一定会觉得不够满意。尤其是JavaScript声明的变量Number可以轻而易举的分配给String,IDE如何执行任何类型的IntelliSense都让人... 查看详情

你应该知道的8个java牛人

简单介绍一下8个Java牛人,他们为Java社区,创建了框架(framework),产品或者是写书,影响甚至改变了Java开发的方法8.Tomcat创始人JamesDuncanDavidson,是当时Sun公司的软件工程师(1997-2001),创建了Java的Web服务器Tomcat,Tomcat广泛应用... 查看详情

visualstudio的奇淫技巧,你知道多少?(代码片段)

如果你像我一样,或许你也沉迷于开发者工具。这就是我喜欢VisualStudio的原因之一——它有无数的生产力技巧。这篇文章将展示五个这样的技巧,这些技巧对我每天的工作都有帮助。请注意,这些仅适用于VisualStudio。... 查看详情

高效使用chrome浏览器,你可能不知道的10个技巧。

」按钮,选择「Settings」。在打开的页面中,找到Debugger下的「DisableJavaScript」选项,将其暂时勾选,禁用浏览器的脚本功能。此时,使用F5刷新当前网页,原本不支持复制的内容就可以随意复制了。当然,这个方法也存在一个弊... 查看详情

你知道java项目该怎么写吗?8个技巧让你写项目如虎添翼!

...更是给别人看的(给以后的自己或者同事),怎么写注释应该都知道,但是一定要注意在那里写。添加注释时的一点建议1.类中,接口等必须有创建时间,创建人,版本号,描述等注释。2.注释不是越多越好,比如:get/set方法就... 查看详情