Table of contents
I. Overview
In project development, there are many repetitive codes, which can be extracted and defined as their own code fragments to improve coding efficiency and achieve rapid development.
Two, detailed explanation
Detailed explanation 1: Select and open the code snippet file
Detailed Explanation 2: Delete code snippet files
After the code snippet file is created, it will always be saved on the local computer. It cannot be deleted directly in VSCode , and must be deleted manually. As shown in the figure below, open the navigation path of VSCode, find the location of the code snippet file according to the path, and delete it directly.
Detailed explanation 3: Select or create a code snippet file
The code snippets manually created by users are divided into two types, one is the global code snippet file, which acts on all projects processed by VSCode, and the other is only for the code snippet file of the current project. The extensions of the two types of files are .code-snippets, and the syntax is exactly the same, but the files are saved in different locations and have different scopes.
Detailed Explanation 4: The Composition of Code Fragments
Code fragments are all defined under a fragment name, and a complete code fragment is divided into four parts, namely scope, prefix, body and description. Fragment scope is the scope, if scope is empty or omitted, the fragment will be applied to all languages. The prefix is used to trigger the fragment, and when the fragment is triggered, the fragment body can be expanded and inserted.
Detailed Explanation Five: Grammar of Fragment Text
-
1
、$1 : the initial position of the cursor after code generation
-
2
, $2 : the second position of the cursor after code generation
-
3
, $3 : the third position of the cursor after the code is generated, and so on, you can use the tab key to quickly switch
-
4.
$0 : the final position of the cursor after generating the code, the order is after $ 1 , 2 , 3 ...
-
5.
${ 1 :defaultValue }: the initial position of the cursor after the code is generated, defaultValue is the default value, you can press the Tab key to skip without editing
-
6.
${ 2 :defaultValue }: The second position of the cursor after the code is generated, defaultValue is the default value, you can press the Tab key to skip directly without editing
-
......
As shown in the figure above, the attribute value of the body is an array, and each array element will have a line break. In the array element, \n can be used to indicate a newline, and \t can be used to indicate a space.
3. Example
Table of contents
I. Overview
In project development, there are many repetitive codes, which can be extracted and defined as their own code fragments to improve coding efficiency and achieve rapid development.
Two, detailed explanation
Detailed explanation 1: Select and open the code snippet file
Detailed Explanation 2: Delete code snippet files
After the code snippet file is created, it will always be saved on the local computer. It cannot be deleted directly in VSCode , and must be deleted manually. As shown in the figure below, open the navigation path of VSCode, find the location of the code snippet file according to the path, and delete it directly.
Detailed explanation 3: Select or create a code snippet file
The code snippets manually created by users are divided into two types, one is the global code snippet file, which acts on all projects processed by VSCode, and the other is only for the code snippet file of the current project. The extensions of the two types of files are .code-snippets, and the syntax is exactly the same, but the files are saved in different locations and have different scopes.
Detailed Explanation 4: The Composition of Code Fragments
Code fragments are all defined under a fragment name, and a complete code fragment is divided into four parts, namely scope, prefix, body and description. Fragment scope is the scope, if scope is empty or omitted, the fragment will be applied to all languages. The prefix is used to trigger the fragment, and when the fragment is triggered, the fragment body can be expanded and inserted.
Detailed Explanation Five: Grammar of Fragment Text
-
1
、$1 : the initial position of the cursor after code generation
-
2
, $2 : the second position of the cursor after code generation
-
3
, $3 : the third position of the cursor after the code is generated, and so on, you can use the tab key to quickly switch
-
4.
$0 : the final position of the cursor after generating the code, the order is after $ 1 , 2 , 3 ...
-
5.
${ 1 :defaultValue }: the initial position of the cursor after the code is generated, defaultValue is the default value, you can press the Tab key to skip without editing
-
6.
${ 2 :defaultValue }: The second position of the cursor after the code is generated, defaultValue is the default value, you can press the Tab key to skip directly without editing
-
......
As shown in the figure above, the attribute value of the body is an array, and each array element will have a line break. In the array element, \n can be used to indicate a newline, and \t can be used to indicate a space.
3. Example