These vs Code shortcuts are so easy to use that I can’t help recording these 34 GIF pictures

Time:2021-6-12

I have written three articles before, and I have gained a very good amount of reading and forwarding

On the one hand, I do use vs Code as my main editor: for remote operation, for note writing, and for code writing (c + + / Python / JavaScript). I already have some experience; On the other hand, I also like to accumulate or read relevant materials (such as the authoritative guide of visual studio code by Mr. Han Jun), and make notes in practice and learning (such as recording GIF).

This article will summarize 34 GIF motion pictures recorded by me, and recommend and organize the vs Code shortcut “keep away from the mouse, improve efficiency” for readers.

The outline of this paper is as follows

  • 6Ctrl+Shift+Altcombination
  • 8 important operations you may not know
  • Three interesting and general niche plug-ins
  • VIM + vscode operation of 5 +

6 combinations of Ctrl + Shift + Alt

Ctrl

CTRL controls the movement of the screen and cursor.

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

CTRL with left and right keys, jump in words.

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

CTRL with up and down keys, small scroll screen (scroll a line).

Shift

Shift is equivalent to “drag the mouse” and combines with the direction keys to select the text.

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

With shift, no longer drag with the mouse.

Alt

ALT is special.

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

The combination of ALT and the up and down keys is called “copy line” in English, which is equivalent to dragging this line up and down.

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

ALT is combined with left and right keys to realize “jump”. For example, when we go to see the definition of a function, we jump to the past. When we finish reading it and want to jump back, we don’t need to use our brains to look for itAlt + ←That’s it(Alt + backspace(same as above).

Ctrl + Shift

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

CTRL + Shift + up, down, left, rightBetter understanding, equivalent to the combination of Ctrl and shift, shift plays the role of selection, and Ctrl makes the step length of direction keys longer (in words).

Ctrl + Alt

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

CTRL + Alt + up and downyesMulti cursor. Note that use escape to exit multi cursor mode.

Shift + Alt

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

Shift + Alt + up and down, copy this line.

8 important operations you may not know

F12 jump reference

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

As shown in the figure above:

  • F12Jump to the definition of variables, functions and classes
  • Shift + F12Jump to its reference; When there are multiple references, you can choose which reference

useF12You can also jump to the source code of the environment library. As shown in the figure below, I jump to the source code of the library gym (using CONDA to install to Lib)core.py

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

Find and replace

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

useCtrl + FIt can be searched; useCtrl + HThe replacement window will pop up. As mentioned above, I willfooReplace withfoobar, usingAlt + RRegular syntax is supported.

Ctrl + Shift + P

Ctrl + Shift + PI’m afraid it’s the most common operation in various editors and debuggers: pop up the command window, then we enter the name of the relevant command, and press enter to execute the command.

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

As shown in the picture above, I useCtrl + Shift + P, executeView: Split Editor RightCommand, then, useCtrl + PCall out the Window Switcher (file switcher).

switch windows

A file that is in a heap and overlaps each other is called a “group” by vs code. We usually use “intra group switching” and “inter group switching”.

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

As shown in the picture above,CTRL + < group number you want to go to >To focus the cursor on the group you want to go to. aboveCtrl + 1Switch to group on the left;Ctrl + 2Switch to group on the right.

andAlt + < number >Switch tabs in group.

In addition, it was noted thatCtrl + Shift + EOpen or close the file manager explorer, which is the tree on the left. andCtrl + BIt’s the side bar.

Building, closing and debugging platform

useCtrl + ~Switch terminals, andCtrl + JThe switch panel is the bottom container that contains the terminal and debugger.

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

In addition,Ctrl + NIs a new file,Ctrl + WIs to close the current file (this applies to almost all windows applications).

Zen mode

Sometimes, the program is too complicated and bloated, which distracts our attention. The vision is not clear, and it will also reduce the comfort.Zen mode will shield these interferences.

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

have access toCtrl + Shift + PinputZenTo call the relevant command. In addition, I changed its shortcut key to (changed in keymaps of the pinion in the lower left corner)Ctrl + Alt + ZAs shown in the picture above, it is very comfortable.

group size

A small display is divided equally by two or more groups. Our code reading screen is too narrow.

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

As shown in the picture above, we can useToggle Editor Group SizesTo switch the reading mode and make it wider. I set the shortcut key toCtrl + Alt + G

Ctrl + i / Ctrl + /

As shown in the figure below, useCtrl + iYou can call the code prompt instead of theCtrl + /The selected text can be annotated or uncommented.

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

Three interesting and general niche plug-ins

Plug in: vscode input sequence

A vscode input sequence solves the trouble of inputting sequence data.

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

As shown in the figure above, with multiple cursors, we can input the data of a sequence, and determine the progressive rules, progressive step size, occupation position, decimal system, etc. of the sequence.

Plug in: relative path

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

I like relative path very much, as shown in the figure belowCtrl + Shift + HWill automatically complete the relative path of the file.

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

Plug in: Auto markdown TOC

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

There are many plug-ins for markdown to generate directories automatically. I think the most friendly one for Chinese should be Hunter tran’s auto markdown TOC.

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

As above, use auto markdown TOC to automatically generate the directory (again, in theCtrl + Shift + PCall the relevant command.

VIM + vscode operation of 5 +

VIM plug in installation

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

As shown in the figure above, download the VIM plug-in. It’s important to pay attention here. It’s highly recommendedDo not use the combination shortcut key Ctrl provided by VIM, because it will override the shortcut keys of vs Code itself and other plug-ins

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

As shown in the figure above, you can search for usectrlkeys configuration in settings and uncheck it.

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

It’s worth noting that we can still use itCtrl + uandCtrl + dScroll up and down the page. The number of scrolling lines is half page size by default.

VIM Foundation

What I want to introduce here is the foundation of vim foundation, but beginners who still don’t have VIM foundation can go to station B to search for VIM related tutorials and consolidate them (I may record videos later).

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

As shown in the figure above:

  • In VIM, the default mode is normal mode. At this time, tapping letters is to tap commands instead of editing text; inputiEnter the insert mode, and then tap the letter to input the letter
  • In insert mode, exit keyEscapeBack to normal mode
  • In normal mode,hjklnamelyBottom left top right

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

As above:

  • In normal mode,Shift + a(to be recorded later)A)Move to the end of line and change to insert mode;IIt’s before the trip
  • In normal mode,oYes, insert a line and jump

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

As above:

  • In normal mode,wIt’s moving one word forward,bMove one word backward

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

As above:

  • In normal mode,dIs to turn on the cut mode, so,dwCut a word;ddIt’s cutting a line
  • In normal mode,yIt’s copying, not copyingpIt’s paste

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

As above:

  • In normal mode,sIs to delete the current cursor and change it to insert mode,xIs deleted and not converted

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

As above:

  • In normal mode,15ggIt’s a jump to15that ‘s ok

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

As above:

  • In normal mode, open and select visual mode

VIM combinational logic commonly used in vs Code

VIM enthusiasts often say: VIM is a kind of logic, not a rote shortcut (I’m not a VIM enthusiast, this sentence is not from me, but from some friends in the Linux community).

My understanding of vim’s logic is as follows:

  • Case is the opposite of logic
  • Some Ctrl and scrolling in vs Code
  • i(signifyIt's in brackets

The expanded explanation is as follows.

Case is the opposite of logic

int foo_xyz = 1;
       ^

We know that when the cursor is in the_If you want to delete the_xyzFirst of allFind the location of the nearest Z, and then delete things in this interval.In VIM, inputdfzTo express,fzthen isFind out what Z means

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

So what is forward looking? The answer is in capitalsFSpecific examples are shown in the figure above.

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

As above, useoYou can easily insert a row down and useOInsert a row up.

Some Ctrl and scrolling in vs Code

![ The []] in VIM(https://gitee.com/piperliu/pi…

As above, useShift + []Is to skip lines in code blocks.

![ CTRL +]] in VIM(https://gitee.com/piperliu/pi…

As above,Ctrl + []Realize the adjustment of indentation. Visual mode is combined here.

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

As above,[[Jump to the first line of the file, and]]It’s the end of the line.

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

As above,HIt’s to the top of the screen,LIt’s the bottom of the screen,MIt’s the center of the screen; andzzIt is “place the cursor in the center of the screen, and do not move the cursor position (scroll the screen)”,ztIs to put the cursor at the top,zbIt’s the bottom.

I (means in brackets

print("delete me")

As above, when we want to emptyprint()Let’s “logically” tell VIM what’s in parentheses. Move the cursor to the brackets and typeci(orci)Of whichi(It’s “in brackets.”.

These vs Code shortcuts are so easy to use that I can't help recording these 34 GIF pictures

As mentioned above, not onlycIt’s not just about operation(), for""[]And so on.

In addition, there are many logic combinations, such as:If J is one line down, then 10J is 10 lines down.In addition,/The search function is also applicable in vs code. However, I prefer vs codectrl + fFind.


Hello, I’m Xiaopai, a graduate student majoring in management science and Engineering in 985 University. I’m a technology enthusiast and self-study scholar. I’m also a student“Continuous improvement: A Study on the quality of products”Supporters and practitioners of ideas. Reprint & Cooperation & learning matters, welcome to add my wechat piperlhj exchange.