Beyond the boundaries of the editor: master the strongest operation skills of Vs Code + Vim

After reading this article, you will become a real "keyboard warrior" from now on

As programmers, we know that it is very laborious to operate the mouse frequently when we write code, and a lot of our time will be wasted to use the mouse to position the cursor to select text, etc. You must know that using shortcut keys is definitely It is more efficient than we use the mouse to operate, including the blogger himself often switches back and forth between the mouse and the keyboard.

For this reason, I wrote this article to supervise myself to get rid of the control of the mouse. I don’t need the mouse to use the keyboard to operate the whole process of writing code. If you stick to it and let the habit form your own muscle memory, I believe that the efficiency of coding will be greatly improved (mainly very Shuai), of course, this article is not only about vim, but also some related plug-in operations to improve coding efficiency, encourage yourself and encourage you! ! !

Table of contents

vim plugin use

vim plugin installation configuration

Explanation of vim mode

Related expansion


vim plugin use

Vim (full name Vi IMproved) is a text editor and is also regarded as a text editing tool. It is developed from another editor Vi (Visual), and has been enhanced and improved in function and performance. It is very popular among programmers because it provides a large number of functions and shortcut keys that can improve the efficiency of editing and manipulating text. Here are its relevant specifics:

Modal editing

vim is a modal editor with multiple modes (Normal, Insert, Visual, Command, etc.). In each mode, the functions of the keys are different, making the editing process more efficient.

Quickly move and navigate

Vim provides a wealth of shortcut keys and commands to quickly move, jump and search in the document, such as using h, j, k, l to move left, down, up, and right, or use / to search forward.

Powerful editing function

vim supports various editing operations, including copy, paste, delete, replace, undo, etc. It also provides some advanced operations like macro recording and batch editing.

Plugins and Customization

vim has an extensive plugin system that can be extended and customized according to individual needs. This allows the programming environment to be individually configured according to the user's preferences and needs.

Although beginners may need some time to adapt to Vim's workflow and shortcut keys, once they are familiar with and mastered Vim, it will become an efficient and powerful editing tool, and ultimately they cannot get rid of the "law of true fragrance " .

vim plugin installation configuration

First open the plug-in menu of the vscode editor, enter vim in the search box, and find the first plug-in Vim to download. Of course, I have downloaded it here. You can download it directly for the first time:

Note here, if you are a Windows user , you can install this plug-in and use it directly ; if you are a Mac user , you need to install the plug-in to give you the details to perform corresponding operations , here is a brief mention:

If you don’t know how to open the setting.json file, you can press Ctrl + shift + p to open the command panel and enter setting.json:

Explanation of vim mode

Vim modes refer to the different working or editing modes in the Vim editor. The Vim mode is divided into several modes, and the functions and behaviors of the keys in each mode are different. Efficiency can only be produced through the cooperation of vim and operator + action:

Normal mode (Normal): Normal mode is the default startup mode for navigation, command execution and editing operations. In Normal mode, keystrokes are interpreted as commands or shortcuts, rather than directly entering text. You can use the commands in Normal mode to move the cursor, delete, paste, etc.

Next, I will briefly explain the cursor movement operation in normal mode.

To perform up, down, left, and right operations in normal mode, here is a trick to remember that the position where the key j is raised on the keyboard is the down arrow. h at the far left moves to the left; l at the far right moves to the right.

How to do a quick jump within a word in normal mode is described here

Here is how to quickly jump in the whole word sentence in normal mode

Here is a description of how to quickly find the position of characters in normal mode. You may be a little confused here. Let me show you a dynamic picture for a corresponding simple display effect.

Here also describes how to delete, modify and copy operations in normal mode:

For example, if you want to delete: enter the normal mode and press the d key to select the current word, then press the d key to delete it directly

For example, if you want to modify: enter the normal mode and press the c key to edit, edit the current word and select iw, edit the entire sentence c

For example, if you want to copy: enter the normal mode and click the y key to copy, and click the y and p keys to copy down

If you want to switch case, you can use the following method:

In order to deepen my understanding, the following case is given:

// 修改字符串 -- ciw
const str = 'HelloWorld'

// 修改泛型或删除泛型 -- ci<(修改) 或 di<(删除) 或 da<(删除)
const count = ref<number>(0)

// 删除括号中的内容 -- di( 或 dib
console.log('foo')

// 删除或修改数组里的内容 -- di[ 或 ci[
const arr = [1,2,3,4,5]

// 删除或修改模板字符串的内容 -- di` 或 ci`
const templateString = `foo${arr}`

// 删除2行 -- 2dd
const a = 11
const b = 22

// 删除template标准里面的所有内容 -- dit 或 cit
<template>
  <Suspense>
    <Count></Count>
  </Suspense>
</template>

Of course there are some small Tis:

View the details of the underlying function: gd

Switch tabs: gt (switch tabs backward), gT (switch tabs forward), 2gt (add number code to jump to the first few)

Switch to file selection: crtl+0

Window switching in the case of split windows: crtl + 1 (switch to the first window)

Of course, if you want to set a shortcut key to open the terminal, you need to configure the settings.json as follows: This can be customized. When I enter 2t, the terminal will automatically open and be focused. After entering the command, I can enter it with crtl+1 first page

  "vim.normalModeKeyBindingsNonRecursive":[
   {
    "before":["2","t"],
    "commands":["workbench.action.terminal.focus"]
   },   
  ],

Insert mode (Insert): used to enter text directly. In Normal mode, press i or I, a or A, o or O and other keys to enter Insert mode. In Insert mode, you can directly type text content as in a normal editor.

Visual Mode (Visual): Used to select or highlight text. You can use various commands and operations to select, copy, delete, modify selected text. Visual mode has several submodes, such as character selection mode, line selection mode, and block selection mode.

Command mode (Command-line): used to execute Ex commands, such as saving files, searching and replacing, setting configuration options, etc. In Normal mode, press the colon: to enter Command-line mode, then enter the corresponding command and press Enter to execute it.

Vim's mode switching is very flexible, and you can quickly switch between different modes for different operations as needed. For example, you can switch from Normal mode to Insert mode to enter text, and then switch back to Normal mode to execute other commands.

Related expansion

In Google Chrome, there is a plug-in similar to vim, which also uses shortcut keys to operate the page, as follows:

After downloading this plug-in, when we browse the web, we no longer need to use the mouse to operate. A keyboard is enough. Of course, after we install this plug-in, the plug-in has an operation manual, which records the use of shortcut keys Methods as below

When you type a question mark in Google Chrome, this box will pop up, which explains the description of the shortcut keys

The function of the shortcut keys is almost the same as what we use in vscode. When you use vim flexibly, you will feel that browsing the web is so smooth when you use this plug-in.

This article is just a brief introduction about vim and some simple uses. If the number of views of this article exceeds 500, the blogger will continue to explain the specific operation of vim in depth

Ditch the mouse and become a real keyboard warrior! ! !

Guess you like

Origin blog.csdn.net/qq_53123067/article/details/132529272