You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
2. All the snippets are located inside of `/snippets/snippets.json`.
5
-
3. a. For new entries, copy the snippet syntax below (or an existing one for simplicity)
4
+
2. All the snippets are located inside of the `/snippets/` folder.
5
+
6
+
-`javascript.json` for Javascript related snippets
7
+
-`snippets.code-snippets` for all other snippets
8
+
9
+
3. How to modify:
10
+
11
+
a. For new entries, copy the snippet syntax below (or an existing one for simplicity)
6
12
7
13
b. For existing entries, simply search the list `Ctrl+F`, and modify as you like.
8
14
9
-
4.Send me a Pull Request
15
+
4.Submit a [pull request](https://github.com/dons20/UIKit-VSCode/pulls) to the repository.
10
16
11
17
#### Snippet Template
12
18
13
19
```json
14
20
"snippet-uk-PREFIX": {
15
21
"prefix": "uk-PREFIX",
16
-
"body": [ "HTML HERE",
17
-
"Multiple Lines Seperated with double quotes and a comma",
18
-
"Last Line does not have a comma"
19
-
],
22
+
"body": [
23
+
"HTML HERE",
24
+
"Multiple Lines Seperated with double quotes and a comma",
25
+
"\t Lines that start with the tab character, can be visually tabbed for better readability, but its not required",
26
+
"Set tab locations with $0 - any number you specify, with $0 automatically being the last tab location",
27
+
"Last Line does not have a comma"
28
+
],
20
29
"description": "Enter your description here"
21
30
},
22
31
```
23
-
Be sure to modify the list of commands in `README.md` with your changes as well!
32
+
If applicable, please update the list of commands in `README.md` with your changes if you added or renamed a snippet.
24
33
25
34
Snippet Modification Tips
26
35
---
@@ -35,16 +44,18 @@ First, [check out Microsoft's offical documentation on snippets](https://code.vi
35
44
36
45
HTML code needs to have proper indentation to be human readable, so use the `\t` modifier in front of a string in the `"body"` to tab it in. You can combine multiple `\t` characters to properly indent the code as you like.
37
46
38
-
Take this example below:
47
+
Take the body portion of a snippet example below:
39
48
40
49
```json
50
+
{
41
51
...
42
-
"body": [ "<html>",
43
-
"\t<body>",
44
-
"\t</body>",
45
-
"</html>"
52
+
"body": [
53
+
"<html>",
54
+
"\t<body>",
55
+
"\t</body>",
56
+
"</html>"
46
57
],
47
-
...
58
+
}
48
59
```
49
60
50
61
When inserted into a document, it would be displayed as:
@@ -59,33 +70,31 @@ When inserted into a document, it would be displayed as:
59
70
#### Testing Changes:
60
71
61
72
1. Press `F1` in Visual Studio Code
62
-
2. Click on "Preferences: Open User Snippets"
73
+
2. Click on "Preferences: Configure User Snippets"
63
74
3. Click on HTML
64
75
4. Copy the contents of `html.json` from the existing project, to your user snippets.
65
-
5. Create a local `.html` file to test it in.
76
+
5. Create a local `html` file to test it in... e.g. `test.html`
66
77
6. Start typing in the command you wish to test.
67
78
68
79
#### Tab Locations
69
80
70
81
When a user enters a snippet, you may want to add some placeholder content for them to modify with ease, simply by pressing tab to cycle through them. The official documentation covers this more, but here are two simple examples.
71
82
72
-
You can have a user tab through locations in order from 1-anything, but 0 is the final stop for the tab.
83
+
You can have a user tab through locations in order from 1 to any number, but `0` is the final stop for the tab.
73
84
```json
74
-
...
75
-
"body": [ "<h1>$1</h1>",
76
-
"<p>$2</p>",
77
-
"<p>$0</p>"
78
-
],
79
-
...
85
+
"body": [
86
+
"<h1>$1</h1>",
87
+
"<p>$2</p>",
88
+
"<p>$0</p>"
89
+
],
80
90
```
81
91
82
92
You can also have placeholder content that is automatically highlighted when the user tabs to it.
0 commit comments