Visual Studio Code入门快捷键

VS Code中的核心编辑器包含了许多功能。这个页面突出显示了其中的一些,并允许您通过使用一些嵌入式编辑器以交互方式试用它们。有关VS代码编辑器功能的全部详细信息以及更多信息,请参阅我们的文档。

  • 多光标编辑块选择,选择所有引用,添加其他光标等等。

  • IntelliSense为您的代码和外部模块获取代码帮助和参数建议。

  • 行操作快速移动行以重新排序代码。

  • 重命名重构在代码库中快速重命名符号。

  • 使用内置的文档和选择格式,格式化可以让您的代码看起来很棒。

  • 代码折叠通过折叠其他区域来关注代码中最相关的部分。

  • 错误和警告在键入时查看错误和警告。

  • 代码段使用代码段打字的时间更少。

  • Emmet集成Emmet支持将HTML和CSS编辑提升到一个新的水平

  • JavaScript类型检查使用零配置的TypeScript对您的JavaScript执行类型检查

    扫描二维码关注公众号,回复: 17234543 查看本文章

多光标编辑

使用多个光标可以同时编辑文档的多个部分,极大地提高了工作效率。请在下面的代码块中尝试以下操作:

  1. 框选择按Shift+向下方向键、Shift+向右方向键 Shift+向上方向键、Shift+向左方向键的任意组合来选择文本块您也可以在用鼠标选择文本时按Shift+Alt,或用鼠标中键拖动选择。

  2. 添加光标按Ctrl+向上方向键在上面添加新光标,或按Ctrl+向下方向键在下面添加新光标。您也可以将鼠标与Alt+Click组合使用,在任意位置添加光标。

  3. 在所有出现的字符串上创建光标选择一个字符串实例,例如背景色,然后按Ctrl+shift+L。现在,只需键入即可替换所有实例。

这只是多光标编辑的冰山一角。查看选择菜单和我们方便的键盘参考指南,了解更多操作。

CSS提示

您可能已经注意到,在上面的例子中,我们还为CSS提供了内联的颜色样本,此外,如果您将鼠标悬停在#之类的元素上,我们将显示这是如何在HTML中表示的。这些样例还可以作为颜色选择器,使您可以轻松更改颜色值。一些特定于语言的编辑器功能的简单示例。

智能感知

Visual Studio Code预装了功能强大的JavaScript和TypeScript。在下面的示例中,将文本光标定位在点的正后方,然后按+空格键调用IntelliSense。注意Canvas APl中的建议是如何产生的。

提示:虽然我们提供了开箱即用的JavaScript和TypeScript支持,但其他语言可以通过众多扩展中的一个进行更好的IntelliSense升级。

行操作

由于在一行中处理整个文本是非常常见的,因此我们提供了一组有用的快捷方式来帮助实现这一点。

1.复制一行,并分别使用Shift+Alt+DownArrow或Shift+Alt+UpArrow将其插入当前位置的上方或下方。

2.分别用+UpArrow和+DownArrow向上或向下移动整行或选定的行

3.使用Ctrl+shift+K删除整行。

重命名重构

重命名符号(如函数名或变量名)很容易。在符号簿中按F2键可以重命名所有实例,这将发生在项目中的所有文件中。右键单击上下文菜单中也有“重命名符号”

JSDoc提示:VS Codes IntelliSense使用JSDoc注释来提供更丰富的建议。当您将鼠标悬停在对Book的引用上时,或者当您创建Book的新实例时,在IntellSense中,JSDoc注释中的类型和文档会显示出来。

格式化

如果没有一个好的格式化程序,很难让代码看起来很好。幸运的是,无论是使用Shift+Alt+F还是使用Ctrl+K, Ctrl+F,它都可以轻松格式化整个文档的内容,也可以通过右键单击上下文菜单使用这两个选项。

提示:扩展库中提供了其他格式化程序。格式化支持也可以通过设置进行配置,例如启用编辑器。格式化保存。

代码折叠

在一个大文件中,折叠代码部分以提高可读性通常很有用。要执行此操作,只需按Ctrl+Shift+]即可折叠,或按Ctrl+Shift+]即可展开当前光标位置的范围。折叠也可以使用左侧边沟中的向下和+括号图标来完成。要折叠所有部分,请使用Ctrl+K , Ctrl+0 组合键;要展开所有部分,则使用Ctrl+K Ctrl+J

提示:折叠是基于缩进的,因此可以应用于所有语言。只需缩进代码即可创建一个可折叠部分,您可以使用快捷键(如Ctrl+K Ctrl+1到Ctrl+K Ctrl+2)折叠一定数量的级别。

错误和警告

当您编辑代码出现红色波浪下划线时,错误和警告会突出显示。在下面的示例中,您可以看到语法错误的数量。按F8键,您可以按顺序浏览它们,并查看详细的错误消息。当你纠正红色波浪下划线错误时,波浪下划线和滚动条指示器将更新。

代码段

通过使用片段,您可以大大加快编辑速度。只需开始键入 try 并从建议列表中选择trycatch,然后按Tab键创建 try-catch 块。您的光标将被放置在文本错误上,以便于编辑。如果存在多个参数,则按 Tab 键跳到该参数。

提示:扩展库包括几乎所有可以想象到的框架和语言的片段。您也可以创建自己的用户定义的代码段。

Emmet

Emmet将snippets的想法提升到了一个全新的水平:您可以键入类似CSS-like 的表达式,这些表达式可以动态解析,并根据您在缩写中键入的内容生成输出。从编辑菜单中选择Emmet:Expand Abstration,将光标放在有效Emmet缩写或代码段的末尾,即可进行扩展。

提示:Emmet备忘单是Emmet语法建议的一个很好的来源。要使用制表键扩展Emmet缩写和代码段,请使用Emmet。triggerExpansionTab设置。查看VS Code中关于Emmet的文档以了解更多信息。

JavaScript类型检查

有时,对JavaScript代码进行类型检查可以帮助您发现可能没有发现的错误。只需在文件顶部添加//Cts检查注释,就可以针对现有的JavaScript代码运行TypeScript类型检查器

提示:您还可以通过添加 "js/ts.implicitProjectconfig.checkJs" : true适用于您的工作区或用户设置,并使用//@ts-nocheck 和 //@ts expect-error. 显式忽略文件或行。查看有关JavaScript VS Code的文档以了解更多信息。

Thanks

好吧,如果你已经走到了这一步,那么你就会接触到Visual Studio代码中的一些编辑功能。但现在不要停止:我们有很多关于该产品的额外文档、介绍视频、提示和技巧,可以帮助您学习如何使用。当你在这里的时候,这里有一些额外的东西你可以尝试:

  • 按Ctrl+`打开集成终端,然后查看终端文档,了解可能的情况

  • 按Ctrl+Shift+G操作版本控制。通过查看版本控制文档了解如何暂存提交、更改分支和查看差异等

  • 按Ctrl+Shift+X,在我们的集成库中浏览数千个扩展。文档将向您展示如何查看最流行的扩展、禁用已安装的扩展等。

现在就到此为止

编码快乐!

猜你喜欢

转载自blog.csdn.net/weixin_36184908/article/details/130205334