当前位置：网站首页>Vscode code debugging skills

Vscode code debugging skills

2022-06-12 10:23:00 【love666666shen】

vscode Basic use

Shortcut key

Ctrl+Shift+P Open the command panel
F5 Start debugging
F12 Go to Define
Ctrl + F12 Jump to the abstract method implementation
Shift + F12 Jump to the method reference
Ctrl + Shift + F Global search （ You need to move the mouse focus to the sidebar , It is Phonetic conversion ）
Ctrl + G Jump to a line of code
Alt + ←/→ : return / Forward Go back / forward(windows Down jump 、 return ;ubuntu yes ctl + alt + -)

vscode Shortcut key

plug-in unit

Tabnine AI Autocomplete for Javascript, Python, Typescript, PHP, Go, Java, Ruby & more
VSCode git plug-in unit GitLens Show current row commit Information
That's what I want VSCode plug-in unit ！
Visual Studio Code Quick start —— Project management plug in Project Manager（ 5、 ... and ）
flow chart vscode-drawio
Use Sublime + PlantUML Draw efficiently
VS Code Use in PlantUML Drawing flow chart 、 Sequence diagram 、 State diagram 、 Class diagram
PlantUML Drawing Introduction
Ubuntu18.04 + VS Code + PlantUML draw UML chart
paste image Copy picture from clipboard to markdown file

among ,GitLens Can enhance VSCode built-in Git The function of . for example commits Search for , History and display of code author identity specific functions can be viewed Feature List.
Git Project Manager Allow you to go directly from VSCode Window opens a new window . So that we can VSCode The warehouse has been switched in . Installing this plug-in unit after , Need to set up gitProjectManager.baseProjectsFolders Including the warehouse we need .

vscode Slow jump

stay VSCode In the press Ctrl + Shift + P, Type in the search box settings, find Open Settings:JSON, stay settings.json Add the following configuration ：
// PS： Use remote ssh Remote development , Be sure to turn on the language server option , Otherwise, the code jump transfer is very slow , See ：vscode Of golang Prompt is slow and vscode gopls The jump is too slow. The solution

stay

 "go.useLanguageServer": true,

vscode Set up 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",
    // Third party library code tips 
    "go.inferGopath": true,
    // Automatically complete packages that are not imported 
    "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： Use remote ssh Remote development , Be sure to turn on the language server option , Otherwise, the code jump transfer is very slow , See ：[vscode  Of  golang  Prompt is slow ](http://www.seaxiang.com/blog/eQ3MJr) and [vscode gopls  The jump is too slow. The solution ](http://www.seaxiang.com/blog/eQ3MJr)
    "go.languageServerFlags": [ 
        "-remote=auto", "-logfile=auto", "-debug=:0", "-rpc.trace", 
    ],
    "go.languageServerExperimentalFeatures": {
    },

    // debug config, For the meaning of each attribute, see  [vscode To configure golang Environmental Science ：settings.json and launch.json](https://www.cnblogs.com/igoodful/p/14066750.html)
    // vscode Commissioning see ：[VScode Launch](https://github.com/golang/vscode-go/blob/master/docs/debugging.md)
    "launch": {
    
        "configurations": [
            {
    
                // name  The name of the drop-down option in the debugging interface 
                "name": "Launch",
                // type  Set to go No change required , yes  vs code  Used to calculate which extension is required for debugging code 
                "type": "go",
                "request": "launch",
                // mode  It can be set to  auto, debug, remote, test, exec  One of them 
                "mode": "auto",
                // program  Path to debugger （ Absolute path ）, The model is debug There are mainly ：${workspaceFolder}  debugging  VS Code  Open all files in the root directory of the workspace ;${file}  Debug the current file ;${fileDirname}  Debug all files in the directory where the current file is located 
                "program": "${fileDirname}",
                // env  Environment variables used during debugging . for example :{ "ENVNAME": "ENVVALUE" }
                "env": {
    },
                // args  Command line parameter array passed to the program being debugged 
                "args": [],
                // showLog  Boolean value , Whether to output debugging information 
                "showLog": false,
                // buildFlags  structure  go  The program is transmitted to  go  Compiler flags 
                "buildFlags": "",
                // remotePath  The absolute path of the remote debugger , When  mode  Set to  remote  Effective when 
                "remotePath":""
            }
        ],
        "compounds": []
    },
    "editor.codeActionsOnSave": {
    }
}

vscode Code debugging

Select the to debug main.go, Click on F5, You can start debugging

Debug shortcuts

Debug shortcuts and Visual Studio Agreement

Ctrl+Shift+P Open the command panel
Ctrl+Shift+D Open the left side Run and Debug
Ctrl+Shift+E Open the file explorer view
F5 Start （ start-up ） debugging
F9 Switch breakpoints
F10 Step over Step by step debugging
F11 Step in Enter function
Shift+F11 Step out Jump out of function

Debug configuration item

Startup and additional configuration

stay VS Code in , There are two core debugging modes Launch and Attach, They deal with two different workflows and developer segments . According to your workflow , Knowing which type of configuration is right for your project can be confusing .

If you are from a browser developer tool background , You may not be used to “ Start from your tool ”, Because your browser instance is already open . When you open DevTools when , You just will DevTools Attach to the browser tab you open . On the other hand , If you're from a server or desktop background , It's normal for your editor to start the process for you , And your editor will automatically attach its debugger to the newly started process .

The best way to explain the difference between boot and attach is to think of boot configuration as how to VS Code The secret of starting an application in debug mode before attaching to it , And how the additional configuration is connected VS Code The secret of the debugger to a running application or process .

VS Code Debuggers usually support starting in debug mode Launch Program or attach in debug mode Attach To a program that has already run . Depending on the type of request （attach or launch） Different , Different properties need to be configured ,VS Code Of launch.json Can provide useful configuration suggestions , And verify it .

VS Code Multiple startup configurations are also supported .
To start a debug session , First, use the configuration drop-down menu in the run view , Choice in launch configurations Related configuration names in the configuration list . After setting the startup configuration , Use F5 Start debugging session .

Once the debug session starts , Will show DEBUG CONSOLE Panel and display debugging output , And the color of the status bar will change （ The default color theme is orange ）：

Log points are variants of breakpoints , It won't “ interrupt ” Into the debugger , Instead, log messages to the console . Log points are particularly useful for injecting logging when debugging production servers that cannot be paused or stopped .

The log point consists of “ The diamond ” The shape icon indicates . Log messages are plain text , But it can be included in curly braces (‘{}’) Expression evaluated in .

When some structure members cannot be displayed directly , You can directly select the variable name , Add to monitor , Or right-click : “ debugging : evaluation ”
If not configured launch.json, You can also debug simple applications , But you can't manage startup configuration and set up advanced debugging .

launch.json attribute

There are many launch.json Property can help support different debuggers and debugging schemes . As mentioned above , Once a value is specified for the attribute , You can use IntelliSense ( Ctrl+Space ) View a list of available properties type.

Basic attributes

Each boot configuration must have the following properties ：

type- The debugger type used for this launch configuration . Each installed debug extension introduces a type ：node for example , For built-in Node The debugger , perhaps php be used for goPHP and Go Expand .
request- The request type for this boot configuration . at present ,launch and attach Supported .
name- An easy to read name that appears in the debug startup configuration drop-down list .
Here are some optional properties available for all boot configurations ：

presentation- Using the order、group and hidden attribute presentation, You can sort configurations and compounds in the debug configuration drop-down list and debug quick selection 、 Group and hide .
preLaunchTask- To start a task before a debug session starts , Please set this property to tasks.json The label of the task specified in （ In the work area .vscode In the folder ）. perhaps , You can set it up ${defaultBuildTask} To use your default build task .
postDebugTask- To start a task at the end of a debug session , Please set this property to tasks.json The name of the task specified in （ In the work area .vscode In the folder ）.
internalConsoleOptions- This property controls the visibility of the debug console panel during a debug session .
debugServer- For debugging extensions only ： This property allows you to connect to the specified port , Instead of starting the debug adapter .
serverReadyAction- If you want to output a specific message to the debugging console or integration terminal when the program you are debugging Web Open in the browser URL. For more information , See the following to open automatically when debugging the server program URI part .
Many debuggers support some of the following properties ：

program- Executable or file that runs when the debugger is started
args- Parameters passed to the program for debugging
env- environment variable （ This value null Can be used for “ Undefine ” Variable ）
envFile- With environment variables dotenv Path to file
cwd- The current working directory used to find dependencies and other files
port- Port when attaching to a running process
stopOnEntry- Interrupt immediately when the program starts
console- Which console to use , for example internalConsole,、、integratedTerminal or externalTerminal

The following is the startup debugging golang Basic configuration of the project ：

{
    
    // 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-  The request type for this boot configuration . at present , Ask for support launch start-up 、attach Add these two ways .
            "request": "launch",
            "mode":"auto",
            // main.go Source file or directory 
            "program": "${workspaceFolder}/cmd/main.go",
            "showLog": true,
            // stopOnEntry-  Whether to enter the interrupt immediately when the program starts 
            "stopOnEntry": false
        }
    ]
}

Use here auto Mode for debugging , The entry of the debugger points to main.go Source file main function .launch The schema will be compiled locally , stay program Generate the compiled executable file in the specified directory __debug_bin, The executable will be deleted after debugging .

Variable substitution

VS Code Provide common paths and other values as variables , And support in launch.json. This means that you don't have to use absolute paths in the debug configuration . for example ,${workspaceFolder} Give the root path of the workspace folder 、${file} Files open in the active editor and ${env:Name} environment variable “ name ”. You can reference... In variables launch.json Or invoked in string properties IntelliSense To see a complete list of predefined variables .

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

Multi project debugging

stay launch.json You can add multiple groups of debugging entries to , Start the debugging of different targets by selecting the corresponding configuration in the debugging panel

{
    "version": "0.2.0",
    "configurations": [
       //  Client configuration 
        {
            "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
        },
        //  Server configuration 
        {
            "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" Medium ${fileDirname} Is to use the currently selected file as the starting point , It is more recommended to use "program" Of ${workspaceRoot}, Configure with the package name as the starting point .

vscode remote-ssh Remote debugging

Use vscode adopt remote ssh When doing remote development , Local open vscode, Connected to the remote ssh After the server , Will be generated on the remote server vscode Server version （ stay ~/.vscode-server Under the table of contents , There are vscode Binary file , Users and remote ssh The configuration file settings.json, And related extensions extensions）.