VScode使用技巧

2024-02-21 11:35

秦倩 563

VSCode 全称 Visual Studio Code，是微软出的一款跨平台的、免费且开源的现代轻量级代码编辑器，支持几乎主流开发语言的语法高亮、智能代码补全、自定义快捷键、括号匹配和颜色区分、代码片段提示、代码对比等特性，也拥有对git的开箱即用的支持。同时，它还支持插件扩展，通过丰富的插件，用户能获得更多高效的功能。软件跨平台支持 Win、Mac 以及 Linux。本文主要介绍一些VScode的使用技巧，提升代码编写效率。

1.新设备同步

换新电脑后，如果习惯了原来的vscode环境，不想再重新配置一遍，就可以使用vscode的设置同步功能。通过设置同步功能，可以将一台电脑上的所有配置都保存下来，也可以根据是自己的需求只同步部分内容，例如键盘快捷键、扩展插件、主题等。设置同步后，在新的电脑上登录账号，开启设置同步功能，就可以让新电脑的vscode拥有与之前相同的配置，节省配置时间。

2.多光标编辑

在编写代码过程中，我们经常会遇到在不同位置添加相同代码的情况，多光标编辑可以实现在不同的位置同时编辑多个光标所在的文本，快速批量操作。多光标编辑有三种开启方法：

Alt + Click：在鼠标单击处添加光标。

Ctrl + Alt + Up/Down：在当前行上/下添加一个光标。

Ctrl + Shift + L：选择所有匹配项并将光标放在每个匹配项上。

3.上下移行

上下移动行可以使用Alt+Up/Down

4.快速跳转到指定代码行

当代码行数过多时，可以使用Ctrl + G 快捷键实现代码行的快速跳转。使用这个快捷键，会弹出一个输入框，可以在其中输入要跳转的行号。输入行号后，按回车键，编辑器将会直接跳转到指定的行数处。这样就能快速地导航到代码的特定行，而不需要手动滚动查找。

也可以使用 ctrl + p 快捷键打开 go-to file 菜单，先输入:,在输入行号即可

5.键盘快捷键

对于开发者而言，熟悉快捷键的使用，能够起到事半功倍的作用，提高工作效率。Vscode中提供了大量的的快捷键，可以使用vscode提供的快捷键，也可以根据自己的编码习惯修改快捷键。

编辑快捷键

常用快捷键

Alt + 鼠标左键：多光标编辑
Alt + Shift + 下键：快速复制行
Ctrl + G：定位到指定行
Ctrl + B：显示/隐藏侧边栏
Ctrl + W：关闭当前文件
Ctrl + Shift + L：选中所有匹配项
Ctrl + [ ：向左缩进
Ctrl + ] ：向右缩进

6.自动保存

当频繁修改文件时，手动保存文件会很麻烦，vscode给我们提供了自动保存功能。自动保存功能使我们无需手动保存文件，当文件发生改变时自动对文件进行保存，节省时间和精力。此外，自动保存功能能确保我们使用的始终是最新的文件版本，避免由于未及时保存而丢失修改的情况。

7.代码片段

代码片段是预定义的代码块，可以通过快捷输入的方式快速插入到编辑器中，提高编码速度和准确性。

在vscode中点击设置选项，选择User Snippets，在弹出的选择框中选择所需的代码片段语言，例如javascript，在对应的文件中定义代码片段。

    "Print to forEach": {
        "prefix": "fevvc",
        "body": [
            "forEach({1 => {})"
        ],
        "description": "Log output to forEach"
    },

    "For Loop": {
        "prefix": ["for", "for-const"],
        "body": ["for (const {{2:element} of {{1:array}) {", "	{0", "}"],
        "description": "A for loop.",
    }
    在线生成代码片段：https://snippet-generator.app/

在线生成代码片段：https://snippet-generator.app/