This is a follow-up post to Creating Code Snippets in Visual Studio.
When creating a Code Snippet for Visual Studio there are a few things to keep in mind.
It’s the $end$ of the World
You can use the
$end$ keyword in your code snippet to specify where the cursor will be placed after the snippet is inserted. If we wanted to place the cursor at the end of out code snippet from Creating Code Snippets in Visual Studio we would add
console.log('hello'); making our code node look like the following:
Now when we use our snippet the cursor should be placed after the semicolon.
Creating a Surrounds With Snippet
If you would like to create a code snippet that surrounds a block of text you have selected that is possible as well. First thing that you will have to do is add the
SnippetTypes to the header section and add the
SurroundsWith snippet types.
Add SnippetTypes to the Header
<SnippetTypes> <SnippetType>Expansion</SnippetType> <SnippetType>SurroundsWith</SnippetType> </SnippetTypes>
Now in your code section you will need to use the
$selected$ keyword to indicate where you want to have the text that is highlighted inserted in your snippet when the snippet is inserted in the document. So if we were creating a code snippet to insert
console.log('') around what we have selected it would look like this.
New and Improved
I created a new snippet that is similar to the one that was previously used just named
mylogwith the super secret and creative shortcut of
Our Updated code snippet should look like this now:
The Whole Kit and Kaboodle
And it should behave like so:
mylog in Action
That’s Great But My Code Contains a
Something you may have noticed by now is that the
$ is being used to designate special key words. This is called the Delimiter and by default the
$ is used. You can specify a different Delimiter by adding a
Delimiter attribute to the
This will still function as before but now allow the used of the
$ in our code itself. This will help if you are using a framework that also uses the