Vscode 基础使用教程大全

简介

本篇文章将详细讲解 Vscode 的基础使用，其中包括以下内容：

1. Vscode 的安装及配置
2. Vscode 基础操作
3. Vscode 插件的安装和使用
4. Vscode 调试功能的使用
5. Vscode 常用快捷键

安装及配置

想要使用 Vscode，首先需要进行安装。可以通过 Vscode 官网直接下载安装包进行安装。

下载并安装好 Vscode 后，可以进行基本的配置。比如设置默认语言，字体大小等等，可以在File -> Preferences -> Settings中进行配置。

基础操作

Vscode 中最常用的操作可能就是打开和编辑文件了，可以通过File -> Open Folder或者快捷键Ctrl + K + O(Windows) 或 Cmd + K + O(Mac)打开文件夹。

除此之外，Vscode 还有很多实用的功能，这里仅列出几个常用的：

1. 搜索：可通过Ctrl + Shift + F(Windows) 或 Cmd + Shift + F(Mac)打开全局搜索框，进行文本或者文件名的搜索。
2. 自动补全：Vscode 提供了丰富的自动补全功能，当编写代码时，可以通过按下Tab键快速补全代码。
3. Git 集成：Vscode 内置了 Git 和 Github 扩展，支持提交文件、查看分支、比较代码等常用的 Git 操作。

插件的安装和使用

Vscode 的插件系统是其强大的功能之一，可以通过插件极大拓展 Vscode 的功能。

要安装插件，可以先进入Extension菜单，点击搜索栏，输入需要安装的插件名，然后点击安装即可。常用的插件有：

1. Auto Close Tag：自动加上 HTML 和 XML 标签的闭合标签。
2. Bracket Pair Colorizer：给当前代码段中的括号添加不同的颜色。
3. Prettier：代码风格工具，可自动整理代码。

调试功能的使用

Vscode 内置了调试功能，可以通过 Vscode 进行代码调试。

在编辑器中打开需要调试的文件，然后点击左侧的调试按键，然后选择要使用的调试环境，Vscode 会自动创建一个 launch.json 配置文件，配置需要调试的程序。

常用快捷键

Vscode 提供了很多实用的快捷键，以下列出一些常用的：

1. Ctrl + Shift + F：全局搜索
2. Ctrl + Shift + O：打开文件
3. Ctrl + P：快速打开文件
4. Ctrl + Shift + X：打开扩展商店
5. Ctrl + Shift + E：打开文件资源管理器
6. Ctrl + Shift + D：打开调试器
7. Ctrl + K + S：打开快捷键列表

示例说明

以下是两个示例说明：

示例一：自动格式化代码

Prettier 插件是一个代码格式工具，可以自动整理代码的格式。安装 Prettier 插件后，在编辑器中右键点击需要格式化的代码，然后选择Format Document即可自动格式化代码。

示例二：调试 Node.js 模块

Vscode 内置了对 Node.js 的调试功能，可以方便地调试 Node.js 程序。对于一个 js 文件，可以给它添加一个 launch.json 配置文件，并在该文件中指定需要调试的脚本路径和参数等内容，然后通过 Vscode 进行调试。例如：

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Launch Program",
            "program": "${workspaceFolder}\\app.js",
            "cwd": "${workspaceFolder}"
        }
    ]
}

通过以上配置即可启动一个 Node.js 程序，并支持调试。