Why will my vs-code snippet not work when the format has been met? - visual-studio-code

i am trying to get the snippet to do this
recipes.addShaped("name", output,
[
[input,input,input],
[input,input,input],
[input,input,input]
]);
the code i am trying to use is this
"Add a shaped": {
"prefix": ["rec", "add"],
"body": ["
recipes.addShaped("${1:name}", ${2:output},
[
[${3:input},${4:input},${5:input}],
[${6:input},${7:input},${8:input}],
[${9:input},${10:input},${11:input}]
]);
"],
"description": "Add a shaped recipe."
}
any help would be appreciated.
dan

Try this:
"Add a shaped": {
"prefix": ["rec", "add"],
"body": [
"recipes.addShaped(\"${1:name}\", ${2:output},",
"[",
"[${3:input},${4:input},${5:input}],",
"[${6:input},${7:input},${8:input}],",
"[${9:input},${10:input},${11:input}]",
"]);"
],
"description": "Add a shaped recipe."
},
All lines of the body have to be separately quoted and the qoutes within a line have to be escaped.
And the result will appear flush left with your current indentation without having to put the body far left like you had it. Just indent the snippet normally to set the left point. Any indentation from there will indent the result.

Related

cannot make VSCode Snippet $TM_CURRENT_LINE work

I created this custom snippet to get line number with alert
"alert-line": {
"scope": "javascript,typescript",
"prefix": "al",
"body": [
"alert(`Line $TM_CURRENT_LINE`);",
],
"description": "alert line"
},
as output I get something weird
alert(`Line al`);
You want TM_LINE_NUMBER or TM_LINE_INDEX, see https://code.visualstudio.com/docs/editor/userdefinedsnippets#_variables.
Your output is correct for $TM_CURRENT_LINE which is the text on the current line. And since your prefix was al and you typed that on an line with a few tabs only - that was the current line's text.

Changing the style of pipe | character in VS Code

My current theme italicizes keywords, comments, and unfortunately, the pipe (|) symbol as well. Pipes should be absolutely vertical.
I found that it is possible to change the theme and below is the example for that:
editor.tokenColorCustomizations": {
"textMateRules": [
{
"name": "Tag brackets",
"scope": ["punctuation.definition.tag"],
"settings": {
"foreground": "#BBBBBB"
}
}
]
}
which changes the color of angle brackets. So I'm thinking there's a similar "scope" key for the pipe characters as well?
Any help is appreciated !!!

How to add space in vscode emmet key suggestions?

There is inbuilt emmet suggestion of #media like in the image below and I wanted to add my custom snippets for max-width and min-width. Which I successfully did with below codes.
{
"css": {
"snippets": {
"#mediaMaxWidth": "#media(max-width: ${1:768}px) {\n\t${2}\n}",
"#mediaMinWidth": "#media(min-width: ${1:768}px) {\n\t${2}\n}"
}
}
}
Problem: : Like in inbuilt emmet there is space between #media screen , I want to create same for my custom one to looks like it so it become #media max-width and #media min-width which I can't seems to achieve.
What I tried and what I expected it to work:
{
"css": {
"snippets": {
"#media max-width": "#media(max-width: ${1:768}px) {\n\t${2}\n}",
"#media min-width": "#media(min-width: ${1:768}px) {\n\t${2}\n}"
}
}
}
There’s no way to add space in abbreviation shortcut. What you see in screenshot is a preview of expanded result, not actual snippet
As #Mark had mentioned in the comment, we can put snippets in snippets/css.json (less.json) if you use less. BUT snippet structure looks different.
To add snippets open File > Preferences > User Snippets then choose the language you want to add snippets to, in this case i choose css.
Add codes based on the documentation in the file it self. Based on my requirement codes look like this.
"media min width 768px": {
"prefix": "#media min-width",
"body": [
"#media(min-width: ${1:768}px) {\n\t${2}\n}",
"$3"
],
"description": "Media min width"
},
"media max width 768px": {
"prefix": "#media max-width",
"body": [
"#media(max-width: ${1:768}px) {\n\t${2}\n}",
"$3"
],
"description": "Media max width"
}
Result:

vscode snippets: repeat what's being typed into given location on the snippet body

I want to know if I can repeat whats being typed on position $1 into the snippet location shown below:
"BootstrapCol": {
"prefix": "BSCol",
"body": [
"<div class="col-$1">$0</div><!-- ./col-{REPEAT WHAT IS BEING TYPED HERE} -->"
],
"description": "Create a Bootstrap Grid col Markup"
}
If so, how?
"<div class=\"col-${1}\">$0</div><!-- ./col-${1} -->"

Plugins HighlightWords in Sublime Text 3 How to configure?

Hello I have downloaded the Plugins HighlightWords to use it with Sublime Text 3 that promises to highlight words using some of the colors. Download it from here:
https://github.com/seanliang/HighlightWords
Could someone help me to change the color of highlighted by default. What I have tried I have not been able to do. This is the file to modify:
{
// The colors to highlight texts are specified by a list of theme scope names,
// and HighlightWords uses this list in circular order.
"colors_by_scope":
[
//"keyword",
//"number",
"string",
"entity.name.class",
"variable.parameter",
"invalid.deprecated",
"invalid",
"support.function"
],
"whole_word": false,
"use_regex": false,
"ignore_case": false,
// Keywords to be always highlighted, clear the list to disable it.
// "keyword" are literally matched, and "color" refers to theme scope names.
// Note that json has some special characters like '\' should be escaped.
"permanent_highlight_keyword_color_mappings":
[
//{"keyword": "TODO", "color": "support.function"},
//{"keyword": "FIXIT", "color": "support.function"},
]
}
You can override default plugin settings in plugin user settings. Goto menu Preferences > PackageSettings > HighlightWords > Settings-User , then add the words and colors you want overriding permanent_highlight_keyword_color_mappings property. Example content:
{
"permanent_highlight_keyword_color_mappings":
[
{"keyword": "stackoverflow", "color": "variable.parameter"},
{"keyword": "sublime", "color": "string"},
{"keyword": "plugin", "color": "invalid.deprecated"},
]
}
Save the file and maybe you need to restart sublime. Result: