It there any way to formatting text inside description field of a snippet?
Basic formatting like \n \t working fine but is there any way for example changing text color or something?
I don't think many people need this feature. If you want for example mark some snippet you can use emoji: 📙📘📗📕🔴🔵🔶🔷
"📗console.log": {
"prefix": "cl",
"body": [
"console.log($1)"
]
}
Related
I have a simple aim here but the execution seems relatively complex. All I would like to do is format Write-Debug and Write-Verbose anywhere they appear as the first text in a line (sometimes indented but no characters in front of them).
I would like to format them the same colour as my comments (or just manually setting them to the same colour is fine). Potentially I might want the same formatting for the rest of the line but that is optional.
I have done a quick google but the depth on the answers seems a lot to get my head around for something so simple, hoping somebody can help simplify it!
Thanks in advance.
You can do this with the Highlight extension.
In your settings:
"highlight.regexes": {
"((^\\s*Write-Debug)|(Write-Verbose))": { // A regex will be created from this string, don't forget to double escape it
"regexFlags": "gm", // Flags used when building this regex
"filterLanguageRegex": "powershell", // Apply only if current file's language matches this regex. Requires double escaping
"decorations": [ // Decoration options to apply to the capturing groups
{ "color": "red" }, // Decoration options to apply to the first capturing group, in this case "//TODO"
]
}
}
There are a lot more styling options at decoration options.
To highlight the whole line use:
"((^\\s*Write-Debug.*)|(Write-Verbose.*))": {
the text has to be in a capture group to be decorated. You could put the rest of the line into a different capture group if you wanted to decorate it differently.
I am trying to create a snippet that gives me choices for optional attributes. I have used this approach in the past where I just put a blank space as a choice in the placeholder. That works when there is only one option between other parts of the snippet but like in the following example if I wanted to skip both placeholders (optional attributes on the adorn) there would be multiple spaces in the generated code which I would have to delete manually.
"Adorn":
"prefix": ["adorn"],
"body": [
"<%= adorn${1| , color: :blue, color: :white|}${2| , inline: true|} do |a| %>",
"\t$0",
"\t<%= a.adornment %>",
"\t\t",
"\t<% end %>",
"<% end %>"
],
"description": "An adorn"
},
From what I can see in the documentation it doesn't seem possible to do what I want using placeholders and choices. I thought I could use a variable and just have it resolve to empty string but the grammar doesn't seem to allow for that.
Is there any other way to accomplish what I am trying to do?
You can use some unicode characters in snippets, so I tried backspace (did not work) but \u200B which is a "zero-width space" does. So you can do this in your choices:
{1|\u200B, color: :blue, color: :white|}${2|\u200B, inline: true|}
and if you choose the blanks (i.e., the \u200B's) a zero-width space will be inserted. And you get what you want - no spaces to be deleted.
But I leave it to you to see if there are any parsing or other problems with having that character in your code. Maybe it is or isn't a problem in your language. See the open issue (which I found after posting this answer initially) https://github.com/microsoft/vscode/issues/34368 ("Allow "empty" as a choice in snippets
") where the zero-width space option is warned against and may cause problems - so test it. It doesn't look like there is any other option but a regular space which you have tried.
I tried "null" \u0000 and it wasn't recognized by vscode.
if a blank space is all you need, then all is needed is an '$1' that the placeholder.
but first let's see if you have errthing
First
at the root of yow project you need a new dir call .vscode
in side yow dir add a new file NOTE name is very important yow new file's must have this pattern any.code-snippets
in side yow new file add this
{
// Place your global snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and
// description. Add comma separated ids of the languages where the snippet is applicable in the scope field. If scope
// is left empty or omitted, the snippet gets applied to all languages. The prefix is what is
// used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders.
// Placeholders with the same ids are connected.
// Example:
"Print to console": {
"scope": "javascript,typescript",
"prefix": "log",
"body": [
"console.log('$1');",
"$2"
],
"description": "Log output to console"
}
}
To finish I recommend you to remove the scope attribute. and do not use the file for more than one language, bcuz if you do so it may not work at all.
The best way to get an empty value for a placeholder with choices is to add a choice of 1 character and remove this with Delete or Backspace (depending where the cursor is, it differs for the 2 placeholders) and then TAB to the next placeholder.
To get the choice list for placeholder 2 press TAB when you are at placeholder 2.
Watch the location of the separating spaces, they are at the end of the choice.
"Adorn": {
"prefix": ["adorn"],
"body": [
"<%= adorn ${1|e,color: :blue ,color: :white |}${2|e,inline: true |}do |a| %>",
"\t$0",
"\t<%= a.adornment %>",
"\t\t",
"\t<% end %>",
"<% end %>"
],
"description": "An adorn"
}
I have the following snippet configured.
{
"Pandas Display All Columns": {
"scope": "python",
"prefix": "pd.options.display.max_columns",
"body": [
"pd.options.display.max_columns = None"
],
"description": "Allows all columns of the dataframe to print"
}
The problem is every time I type a period . and hit enter it auto-completes with this snippet. For example if I'm typing a doc string and use a period and hit enter. I know, I know... working as designed.
If I shorten the prefix so it does not contain and dot character . so only pd is used, it is not intuitive when the intellisense pops up. How do you suggest I formulate my snippet so it is intuitive and not showing every time I type . all by itself?
I am not sure what the best way to word this question is. It is possibly why I am on StackOverflow because I cannot find a result on Google. Let me give it a try.
Assume I have the following HTML in my editor:
<li>One</li>
<li>Two</li>
<li>Three</li>
Is there a way to highlight all three of those lines, perhaps (on MacOS) using cmd+L and wrap them conveniently in <ul></ul> tags? Right now my process for doing this includes:
writing out <ul></ul> above the HTML I want to wrap. Hit return for a line break between the two tags I want to embed content between.
select the code block I want to embed between those tags using cmd+L
on MacOS, hit option+Up Arrow Key to move it in between the tags.
This is kind of awkward. Is there a simpler keyboard shortcut to do this, not just for HTML but for any code? It would be great to be able to take code like this:
car.turnLeft()
and simply wrap it in a condition very quickly without following the 3 non-optimal steps above:
if (car.isHeadedWrongDirection()) {
car.turnLeft()
}
The example above is forcefully contrived, but I think it makes the point for what I would like to accomplish in the editor.
The general form for wrapping is to use $TM_SELECTED_TEXT within a snippet. Like
"if wrap": {
"prefix": "*s",
"body": [
"if car.$1()) {",
"\t${TM_SELECTED_TEXT}",
"}"
],
"description": "Wrap selection in if statement"
},
That snippet goes into one of your snippet files, see create a snippet.
Because the snippet trigger, here *s will negate your selection, you will need to trigger the snippet with a keybinding, in keybindings.json:
{
"key": "alt+i", // whatever keybinding you want
"command": "editor.action.insertSnippet",
"args": {
"name": "if wrap" // the name you gave your snippet
},
"when": "editorTextFocus"
},
Now select the text you want to wrap and trigger the keybinding alt+i.
There are other ways to avoid having to select the text first that you want to wrap or to not actually consume the text - if you wanted to add the if wrap below the text for example.
I want to do something like that in my snippets for visual studio code:
"V.G.${1|BLOCK_NR,MASS_MM,MASS_360,I,J,K,R,FEEDRATE,FEEDRATE_SCALE,MERR[${2}]|}"
So after choose the option MERR[] I will see the cursor inside the brackets.
and how i have to manage sub choices like:
"V.G.${1|choice${2|subchoiceA,subchoiceB|},choice, choice......}"
If I choose MERR[] Option I will jump into [Cursor should be here]. How can i handle this?
Here is a workaround to your subchoiceA/B question because you cannot have anything except plain text as choices - no tabstops or subchoices, etc. Your example:
V.G.${1|choice${2|subchoiceA,subchoiceB|},choice, choice......}"
This can be achieved however with 2 snippets:
"choices with subchoices": {
"prefix": "_choices", // whatever prefix you want
"body": [
"V.G.${1|choice1, _subchoices,choice2,choice3|}"
],
"description": "variables in a choice element"
},
"my subchoice list": {
"prefix": "_subchoices", // this prefix must be what you used in the main snippet
// as your subchoice option
"body": [ "${1|subchoiceA,subchoiceB|}" ],
"description": "subChoices"
},
What happens is that when you choose the subchoices option in the main snippet it will see it as the prefix for the second snippet - that is pretty neat. But it will not do so until you trigger that recognition with Ctrl+Space the usual intellisense trigger and then tab to select the second snippet.
It is only one or two extra keystrokes to get subchoices working inside of a parent choice element when otherwise it can't be done at all.
The only issue is that your second prefix - here subchoices cannot be a continuation of another string with no spaces otherwise it won't be recognized as a standalone snippet prefix by vscode. That is why I added the space before subchoices in the main snippet since your example has "V.G.${1....} with no space before the option would be inserted.
Here is a demo: