VSCode插件、快捷键及代码调试技巧

love666666shen

已于 2023-03-15 23:46:09 修改

阅读量5.9k

点赞数 6

分类专栏：开发工具文章标签： vscode 快捷键 remote ssh 代码调试远程调试

于 2022-06-05 23:29:28 首次发布

本文链接：https://blog.csdn.net/love666666shen/article/details/125138514

版权

开发工具专栏收录该内容

39 篇文章

订阅专栏

vscode基本使用

快捷键

Ctrl + Shift + P 打开命令面板
Ctrl + Shift + ~ 打开vscode的终端
F5 开始调试
F12 Go to Define
Ctrl + F12 跳转至抽象方法实现
Shift + F12 跳转至方法引用的地方
Ctrl + Shift + F 全局搜索（需要将鼠标焦点移至侧边栏，否则是拼音简繁转换）
Ctrl + G 跳转到某行代码
Alt + ←/→ :返回/前进 Go back / forward(windows下跳转、返回；ubuntu是ctl + alt + -)

vscode快捷键

插件

Tabnine AI Autocomplete for Javascript, Python, Typescript, PHP, Go, Java, Ruby & more
VSCode git插件 GitLens 显示当前行commit信息
 这就是我想要的 VSCode 插件！
Visual Studio Code 快速入门 —— 项目管理插件 Project Manager（五）
流程图vscode-drawio
使用 Sublime + PlantUML 高效地画图
 VS Code中使用PlantUML绘流程图、时序图、状态图、类图
 PlantUML绘图介绍
 Ubuntu18.04 + VS Code + PlantUML绘制UML图
 paste image从剪贴板复制图片到markdown文件

其中，GitLens 可以增强 VSCode 内置 Git 的功能。例如 commits 搜索，历史记录和显示的代码作者身份具体功能可以查看 Feature List。
Git Project Manager 允许你直接从 VSCode 窗口打开一个新的窗口。这样我们就可以在 VSCode 中切换仓库了。在安装这个插件后，需要设置 gitProjectManager.baseProjectsFolders 包含我们需要的仓库。

vscode跳转慢

在 VSCode中按下Ctrl + Shift + P，在搜索框中输入settings，找到Open Settings:JSON，在settings.json中添加如下配置：
// PS：使用remote ssh进行远程开发，一定要打开语言服务器选项，要不然代码跳转会非常慢，参见：vscode 的 golang 提示很慢和vscode gopls 跳转太慢解决方法

在

 "go.useLanguageServer": true,

vscode 设置settings.json

{
    "remote.SSH.remotePlatform": {
        "192.168.xxx.xxx": "linux",
        "Ubuntu": "linux"
    },
    "remote.SSH.showLoginTerminal": true,
    "editor.fontSize": 19,
    "extensions.ignoreRecommendations": true,
    "go.formatTool": "goimports",
    "go.docsTool": "gogetdoc",
    "go.trace.server": "verbose",
    "files.eol": "\n", // formatting only supports LF line endings
    "editor.suggest.snippetsPreventQuickSuggestions": false,
    "editor.hover.delay": 10,
    // The default for files.watcherExclude excludes node_modules and some folders under .git, but you can add other directories that you don't want VS Code to track.
    "files.watcherExclude": {
        "**/.git/objects/**": true,
        "**/.git/subtree-cache/**": true,
        "**/node_modules/*/**": true,
        "**/.hg/store/**": true
    },
    "go.goroot": "/usr/local/go",
    "go.gopath": "/home/username/go",
    //第三方库代码提示
    "go.inferGopath": true,
    //自动完成未导入的包
    "go.autocompleteUnimportedPackages": true,
    "go.gocodePackageLookupMode": "go",
    "go.gotoSymbol.includeImports": true,
    "go.useCodeSnippetsOnFunctionSuggest": true,
    "go.useCodeSnippetsOnFunctionSuggestWithoutType": true, 

    "[go]": { 
        "editor.formatOnSave": true, 
        "editor.codeActionsOnSave": { 
            "source.organizeImports": true, 
        },    // Optional: Disable snippets, as they conflict with completion ranking.    "editor.snippetSuggestions": "none", 
        "editor.snippetSuggestions": "none",
    },
    "[go.mod]": { 
        "editor.formatOnSave": true, 
        "editor.codeActionsOnSave": { 
            "source.organizeImports": true, 
        },
    },
    
    "gopls": { 
        // Add parameter placeholders when completing a function. 
       "usePlaceholders": false, 
       // If true, enable additional analyses with staticcheck. 
       // Warning: This will significantly increase memory usage.   
       "staticcheck": false,
    },
    "go.useLanguageServer": true,
    // PS：使用remote ssh进行远程开发，一定要打开语言服务器选项，要不然代码跳转会非常慢，参见：[vscode 的 golang 提示很慢](http://www.seaxiang.com/blog/eQ3MJr)和[vscode gopls 跳转太慢解决方法](http://www.seaxiang.com/blog/eQ3MJr)
    "go.languageServerFlags": [ 
        "-remote=auto", "-logfile=auto", "-debug=:0", "-rpc.trace", 
    ],
    "go.languageServerExperimentalFeatures": {},

    // debug config，各属性意义参见 [vscode配置golang环境：settings.json和launch.json](https://www.cnblogs.com/igoodful/p/14066750.html)
    // vscode调试参见：[VScode Launch](https://github.com/golang/vscode-go/blob/master/docs/debugging.md)
    "launch": {
        "configurations": [
            {
                // name    调试界面下拉选择项的名称
                "name": "Launch",
                // type    设置为go无需改动，是 vs code 用于计算调试代码需要用哪个扩展
                "type": "go",
                "request": "launch",
                // mode    可以设置为 auto, debug, remote, test, exec 中的一个
                "mode": "auto",
                // program    调试程序的路径（绝对路径），模式为debug时主要有：${workspaceFolder} 调试 VS Code 打开工作空间的根目录下的所有文件；${file} 调试当前文件；${fileDirname} 调试当前文件所在目录下的所有文件
                "program": "${workspaceFolder}/app/api/main.go",   # 这里指定项目app/api目录下的main入口，这样就可以在该项目的任意位置（不用非调到main.go主程序）开启debug调试模式
                // env    调试时使用的环境变量。例如:{ "ENVNAME": "ENVVALUE" }
                "env": {},
                // args    传给正在调试程序的命令行参数数组
                "args": [],
                // showLog    布尔值，是否将调试信息输出
                "showLog": false,
                // buildFlags    构建 go 程序时传给 go 编译器的标志
                "buildFlags": "",
                // remotePath    远程调试程序的绝对路径，当 mode 设置为 remote 时有效
                "remotePath":""
            }
        ],
        "compounds": []
    },
    "editor.codeActionsOnSave": {}
}

vscode代码调试

选中要调试的main.go, 点击F5, 既可以开始调试

调试快捷键

调试快捷键和Visual Studio一致

Ctrl+Shift+P 打开命令面板
Ctrl+Shift+D 打开左侧Run and Debug
Ctrl+Shift+E 打开文件资源管理器视图
F5 开始（启动）调试
F9 切换断点
F10 Step over单步调试
F11 Step in进入函数
Shift+F11 Step out跳出函数

调试配置项

启动与附加配置

在 VS Code 中，有两种核心调试模式Launch和Attach，它们分别处理两个不同的工作流程和开发人员细分。根据您的工作流程，知道哪种类型的配置适合您的项目可能会令人困惑。

如果您来自浏览器开发者工具背景，您可能不习惯“从您的工具启动”，因为您的浏览器实例已经打开。当您打开 DevTools 时，您只是将DevTools 附加到您打开的浏览器选项卡。另一方面，如果您来自服务器或桌面背景，让您的编辑器为您启动进程是很正常的，并且您的编辑器会自动将其调试器附加到新启动的进程。

解释启动和附加之间区别的最佳方法是将启动配置视为如何在VS Code 附加到它之前以调试模式启动应用程序的秘诀，而附加配置是如何连接 VS Code 的秘诀调试器到已经运行的应用程序或进程。

VS Code 调试器通常支持在调试模式下启动Launch程序或在调试模式下附加Attach到已经运行的程序中。根据请求类型（attach或launch）的不同，需要配置不同的属性，VS Code 的launch.json可以提供有用的配置建议，并加以验证。

VS Code 还支持同时启动多个配置的复合启动配置。
为了启动调试会话，首先使用运行视图中的配置下拉菜单，选择在launch configurations配置列表中相关的配置名。设置好启动配置后，使用F5启动调试会话。

一旦调试会话开始，就会显示DEBUG CONSOLE面板并显示调试输出，并且状态栏会改变颜色（默认颜色主题为橙色）：

日志点是断点的变体，它不会“中断”到调试器中，而是将消息记录到控制台。日志点对于在调试无法暂停或停止的生产服务器时注入日志记录特别有用。

日志点由“菱形”形图标表示。日志消息是纯文本，但可以包含要在花括号 (‘{}’) 内计算的表达式。

某些结构体成员无法直接显示时, 可以直接选中变量名, 添加到监视, 或者右键点击: “调试:求值”
如果没有配置launch.json，也可以调试简单的应用程序，但无法管理启动配置和设置高级调试。

launch.json属性

有许多launch.json属性可以帮助支持不同的调试器和调试方案。如上所述，一旦为属性指定了值，就可以使用 IntelliSense ( Ctrl+Space ) 查看可用属性的列表type。

基本属性

每个启动配置都必须具有以下属性：

type- 用于此启动配置的调试器类型。每个安装的调试扩展都引入了一种类型：node例如，用于内置的 Node 调试器，或者php用于goPHP 和 Go 扩展。
request- 此启动配置的请求类型。目前，launch并attach受支持。
name- 出现在调试启动配置下拉列表中的易于阅读的名称。
以下是可用于所有启动配置的一些可选属性：

presentation- 使用对象中的order、group和hidden属性presentation，您可以在调试配置下拉列表和调试快速选择中对配置和化合物进行排序、分组和隐藏。
preLaunchTask- 要在调试会话开始之前启动任务，请将此属性设置为tasks.json中指定的任务的标签（在工作区的.vscode文件夹中）。或者，可以将其设置${defaultBuildTask}为使用您的默认构建任务。
postDebugTask- 要在调试会话结束时启动任务，请将此属性设置为tasks.json中指定的任务的名称（在工作区的.vscode文件夹中）。
internalConsoleOptions- 此属性控制调试会话期间调试控制台面板的可见性。
debugServer-仅适用于调试扩展作者：此属性允许您连接到指定端口，而不是启动调试适配器。
serverReadyAction- 如果您想在正在调试的程序向调试控制台或集成终端输出特定消息时在 Web 浏览器中打开 URL。有关详细信息，请参阅下面的调试服务器程序时自动打开 URI部分。
许多调试器支持以下一些属性：

program- 启动调试器时运行的可执行文件或文件
args- 传递给程序进行调试的参数
env- 环境变量（该值null可用于“取消定义”变量）
envFile- 带有环境变量的 dotenv 文件的路径
cwd- 用于查找依赖项和其他文件的当前工作目录
port- 附加到正在运行的进程时的端口
stopOnEntry- 程序启动时立即中断
console- 使用哪种控制台，例如internalConsole，、、integratedTerminal或externalTerminal

下面是启动调试golang项目的基本配置：

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Launch job debug",
            "type": "go",
            // request- 此启动配置的请求类型。目前，请求支持launch启动、attach附加这两种方式。
            "request": "launch",
            "mode":"auto",
            // main.go源文件或目录
            "program": "${workspaceFolder}/cmd/main.go",
            "showLog": true,
            // stopOnEntry- 程序启动时是否立即进入中断
            "stopOnEntry": false
        }
    ]
}

这里使用auto模式进行调试，调试程序的入口指向main.go源文件主函数。launch模式会在本地编译，在program指定的目录下生成编译后的可执行文件__debug_bin，调试结束会删除该可执行文件。

变量替换

VS Code 将常用路径和其他值作为变量提供，并支持在launch.json. 这意味着您不必在调试配置中使用绝对路径。例如，${workspaceFolder}给出工作区文件夹的根路径、${file}在活动编辑器中打开的文件以及${env:Name}环境变量“名称”。您可以在变量参考launch.json中或通过在字符串属性中调用 IntelliSense来查看预定义变量的完整列表。

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

多项目调试

在launch.json中可以添加多组调试入口, 通过调试面板中选中对应的配置开启不同目标的调试

{
    "version": "0.2.0",
    "configurations": [
       // 客户端配置
        {
            "name": "client",
            "type": "go",
            "request": "launch",
            "mode": "debug",
            "remotePath": "",
            "port": 2345,
            "host": "127.0.0.1",
            "program": "${fileDirname}",
            "env": {
                "GOPATH":"D:/Develop/vscodegolang"
            },
            "args": [],
            "showLog": true
        },
        // 服务端配置
        {
            "name": "server",
            "type": "go",
            "request": "launch",
            "mode": "debug",
            "remotePath": "",
            "port": 2345,
            "host": "127.0.0.1",
            "program": "${workspaceRoot}/src/server",
            "env": {
                "GOPATH":"D:/Develop/vscodegolang"
            },
            "args": [],
            "showLog": true
        }
    ]
}

"program"中的${fileDirname}是以当前选中文件作为启动点，更建议使用"program"的${workspaceRoot}，以包名作为启动点的方式进行配置。

vscode remote-ssh远程调试

使用vscode通过remote ssh进行远程开发时，本地开启vscode，连接上remote ssh服务器后，会在远程服务器上生成vscode服务器版本（在~/.vscode-server目录下，该目录下有vscode的二进制文件，用户及remote ssh配置文件settings.json，还有相关扩展extensions）。