Shulou(Shulou.com)06/02 Report--

Editor to share with you how to use VSCode tips, I believe that most people do not know much about it, so share this article for your reference, I hope you will learn a lot after reading this article, let's go to know it!

In the open source IDE market, Visual Studio Code (VSCode for short) has become more and more popular in recent years. Since its release in 2015, 35% of developers have switched to VSCode, according to a 2018 Stack Overflow survey. Next, I'll introduce some suggestions and tips to make you use VSCode more efficiently.

Git and Gitlens

Git is arguably the most popular software among developers, and it is much easier to operate Git directly from IDE than from the command line. Git module can help you to do stage, commit, stash, undo and other operations. The Gitlens plug-in offers more possibilities. The most useful feature of Gitlens is that you can see the commit history of each line of code.

Real-time sharing

VSCode Live Share is an experimental feature. This is what the official website says:

No matter what type of application you build, what language you program in, or what operating system you use, real-time sharing can immediately share your project with your teammates when you need to collaborate. Teammates can edit and debug in real time without cloning the repository or setting up their environment.

Through Live Share, you can edit and debug together, as well as share audio, servers, terminals, differences, comments, and so on. Whether it's code review, pair programming with teammates, participating in Hackathon events, or giving interactive lectures, Live Share can support you in a variety of writing ways.

JSON to Code

Have you ever experienced that when faced with an API, you want the data structure returned by it to have a type definition, but you don't have to define it manually? Paste JSON as Code can convert the JSON file to a type definition of the target language with one click.

Batch renaming

Refactoring is necessary when writing and maintaining code, especially when you ReFactor a large module or a large piece of code, it can be a headache to find and modify variable / function names one by one. Fortunately, VSCode can help us.

If you select a variable / method name and then press F2, you can edit the selected name and all related instances in the entire project will be modified.

If you only want to modify the current file, use the Command+F2 (Mac) or Ctrl+F2 (Windows) command.

Jump to definition

When writing code, when faced with a variable / method, you tend to forget the meaning of its reference. What should I do at this time? It will take you a few minutes to search the entire project and locate it in the right place. In VSCode, you can use Command (Mac) / Ctrl (Windows) and click the corresponding variable / method name, and VSCode will automatically jump to the correct location.

Alternatively, you can pause the cursor over the variable / method name and press Command (Mac) / Ctrl (Windows), which will pop up the variable / function definition next to the current cursor. This saves the trouble of jumping to another location.

Multi-line editing

If you want to insert / delete multiple instances of the same text, you can create a Multiple cursor. You can hold down the Option (Mac) / Alt (Windows) button, and every time you click, the cursor stops at the current position. Each click creates a new cursor, and then you can edit these locations at the same time.

Very useful in HTML, especially if you want to change the class name / hyperlink, and it appears in many places.

Debugger

Debugger itself has a lot of content, and VSCode has a special video to introduce it.

Youtube video address: VSCode debugging Node.js

Bind shortcut key

If you want to work efficiently, turn your commonly used commands into keyboard shortcuts. You can quickly view the core commands through cheat sheet/ "View Shortcut key bindings".

The command console is your best friend. You can use Command+p (Mac) / Ctrl+p (Windows) to open it. Enter the file name and you can quickly jump to the specified file. This is much faster than if you look slowly in the project directory on the left.

● you can enter > to view all available tasks

● uses the @ symbol to get all the Symbols of the current file (variables / functions / class names / methods, etc.)

Custom bind shortcut key

There is one command missing in VSCode, and that is "Save all". We can customize one: Command+Shift+S (Mac) / Ctrl+Shift+S (Windows).

The above is all the contents of this article entitled "Tips for using VSCode". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.