TypeScript snippets in VS

[craigktreasure]

Moving this over from CodePlex (23 votes, assigned to jonturner, http://typescript.codeplex.com/workitem/938):

I would really like to be able to use a TypeScript version of the JavaScript code snippets when writing TypeScript in Visual Studio.

[RyanCavanaugh]

What kind of snippets would you like to see?

[craigktreasure]

I think all of the existing snippets for the JavaScript language would be a good start. JSDoc snippets and auto completion would be a huge win! I would love it if TypeScript code was as quick and easy to document as it is in C# today. For example, a /// is all it takes to generate the documentation scaffolding and then I just need to add descriptions.

Also, TypeScript doesn't appear as a language in the Code Snippets Manager, so I can't add custom snippets (that i'm aware of anyways).

[Cotspheer]

I miss the language too within the Code Snippets Manager. So for me it would be great if I just could add custom snippets. That's all what I need.

[knazeri]

What kind of snippets would you like to see? @RyanCavanaugh

For starter I love /// to create a template of a documentation comment and fill in the parameters and other information. There are loads of different snippets that could make coding quicker and easier:

• ctor
• prop
• switch
• for
• try
• tryf

And a shortcut to launch the Insert Snippet menu (ie. CTRL+K, X) would be nice. I also miss the magical smart tag (ctrl + .) to automatically import, implement interfaces, etc.. like everyday when I'm coding TypeScript in VS!

[mhegazy]

@KamyarNazeri /// comments template support should be an issue by itself. Just having snippets will not give you what you are looking for.

[knazeri]

@mhegazy What kind of issue are we talking about?

[danquirk]

He just means it's a separate feature from code snippets and should be tracked in a separate issue on the issue tracker.

[mhegazy]

yup. thanks @danquirk for the clarification, we need two issues here :)

[frodegil]

AngularJS code snippets for controllers, services, directives, etcetera would be really nice to have available in VS.

[NoelAbrahams]

@frodegil, AngularJS and code snippets for other frameworks will need to be handled by custom snippets. A custom snippet for JavaScript is defined as follows:

<CodeSnippet Format="1.0.0" xmlns="http://schemas.microsoft.com/VisualStudio/2005/CodeSnippet">
    <Header>
        <Title>Closure</Title>
        <Author>Me</Author>
        <Shortcut>closure</Shortcut>
        <Description>Code snippet for a JavaScript closure</Description>
        <SnippetTypes>
            <SnippetType>Expansion</SnippetType>
            <SnippetType>SurroundsWith</SnippetType>
        </SnippetTypes>
    </Header>
    <Snippet>
        <Code Language="JavaScript">
            <![CDATA[(function () {
  $selected$
})($end$);]]>
        </Code>
    </Snippet>
</CodeSnippet>

I believe this request is for TypeScript files to support the following: (a). Launch the "Insert Snippet" dialogue on Control+K, Control+X. (b). Provide a set of built-in snippets (for if, try etc) (c). Permit defining custom snippets as above.

[danquirk]

Personally I don't think snippets should be in their own menu with a long, awkward key chord to invoke. There's no reason they can't be treated like any other completion result as many other languages/editors do.

[NoelAbrahams]

Personally I don't think snippets should be in their own menu with a long, awkward key chord to invoke. There's no reason they can't be treated like any other completion result as many other languages/editors do.

:+1:

[sumitkm]

I second @NightkingCH ! If TypeScript were visible as a language in Snippet Manager we could create our own snippets and use them. Currently I if make TS snippets as JavaScript they are not usable in TS files :-(

[CodeZombieCH]

Totally agree with @NightkingCH .

[vilicvane]

Here's a dark way to make JS snippets work in TS... But certainly we won't use it in practice, just for fun.

1. Create a JS file and open it.
2. Rename it to .ts...
3. LOL...

And it's a shame that there is still no snippet support in TS 1.3 for VS 2013.

[knazeri]

Just out of curiosity, are snippets going to make into VS2015 final release? Or the preview release is pretty much everything we will see the final release?

[mwilc0x]

Just ran into this issue today. :+1: please!

[Mogikan]

Add TS language to Code Snippets Manager, please!

[gravidThoughts]

12 more votes for TS Code Snippets!!!! Custom Snippets at a minimum, and maybe useful snippets out of the box.

I am repping my colleagues :)

[jon49]

An auto curry interface generator would be nice too:

http://stackoverflow.com/questions/28566969/create-programmable-snippet-for-visual-studio-with-node-js-code

[vilicvane]

Can we expect this to be in 1.5 tools?

[paulvanbrenk]

@vilic this looks like something we would add for 1.6, most of the work is probably in the creation of the snippet files (inc. translation, setup etc.).

[vilicvane]

Good to know, thanks! @paulvanbrenk

[NoelAbrahams]

I hope the new snippets are a bit radical - along the lines of @danquirk's suggestion:

Personally I don't think snippets should be in their own menu with a long, awkward key chord to invoke. There's no reason they can't be treated like any other completion result as many other languages/editors do.

I should just be able to start typing my-custom-snippet anywhere on a code file, and the snippet should be rendered at the point of the cursor upon selection.

[paulvanbrenk]

@NoelAbrahams unfortunately we (TypeScript) don't control that part of the snippet experience without a lot of customization (for my-custom-snippet), it will work that way for inbox-snippets. I will bring this up with the team that is responsible for the overall snippet experience, and you can add that as an item on http://visualstudio.uservoice.com.

[fpenarru]

+1

[araqiel2552]

region snippet missing in Visual Studio 2015 :'(

[drake7707]

Some others I'd like to see that aren't mentioned yet

forof -> for(let el of elements) { ... }
forr -> for(let i = length-1; i >= 0; i--) { ... }

[Neurothustra]

can we make this happen? As in, all of it?

[sebdoucet]

This is a real problem, from your team but also from VS Team. Why snippets need to be activated or whatever other limitation. Code snippet should always be accessible for all language supported by VS... From C#, I never write a complete for or property accessor...even javascript have a better support on Visual Studio!

Sublime already have snippets for Typescript and from to long time Typescript run better on sublime... I'm about to switch definitively.

[titobf]

+1 It would be really nice to have this feature. I was going to create my own snippet for TS and then realized that it's not possible.

[gildorwang]

+1

[sambres]

+1

[erik-r-peterson]

+1

[zpdDG4gta8XKpMCd]

if anyone has time please consider implementing and sharing a working example of this:

• https://msdn.microsoft.com/en-us/library/ff926100.aspx

[paulvanbrenk]

Actually you'll want to reference the Roslyn implementation[0].. since that'll solve you a bunch of time.

[0] https://github.com/dotnet/roslyn/blob/a4e375b95953e471660e9686a46893c97db70b0e/src/VisualStudio/CSharp/Impl/Snippets/CSharpSnippetInfoService.cs

[ZenSoftware]

+1

[sstorie]

Man, I just assumed this would be supported in the latest version of Visual Studio 2015, and found this while starting to create some Angular 2 snippets. I can't believe this is something that VSCode handles perfectly, but the flagship product can't...

[MCKRUZ]

Which project do we need to post on to make this a feature in Visual studio 2015?

[mhegazy]

Which project do we need to post on to make this a feature in Visual studio 2015?

you are in the right place.

[MCKRUZ]

sorry, is this something that is going to be incorporated into Visual Studio 2015 soon?

[mhegazy]

It is on the list of committed features. I do not have an ETA at the time being. there are other features/bugs that we are working on as well, and we are a small team.

[MCKRUZ]

Can the community help in any way?

[mhegazy]

Can the community help in any way?

Unfortunately no. this is part of the VS plugin code that is not open source at the moment.

[AkosLukacs]

Just adding typescript in the list of languages supported by the built in snippet engine would allow the community, or companies to define the snippets themselves. For example there are a bunch of JS snippets in the Side waffle pack. Not created by MS, but usable by anyone.

[sebdoucet]

Yep, totaly agree with that!! I've already make custom ones for JS and C# and it will take me 1h to get the most used like if,for's,get,set,class,namespace...

It's a huge lost of time to write a complete and boring for-i !!

Unlock it on VS or give the way to add a language.

[MCKRUZ]

I actually already added typescript snippets to side waffle, I'm just waiting for the typescript team to finish their piece.

On Jun 4, 2016, at 1:53 AM, Ákos Lukács notifications@github.com wrote:

Just adding typescript in the list of languages supported by the built in snippet engine would allow the community, or companies to define the snippets themselves. For example there are a bunch of JS snippets in the Side waffle pack. Not created by MS, but usable by anyone.

— You are receiving this because you commented. Reply to this email directly, view it on GitHub, or mute the thread.

[ringil-21]

+1

[jojogeyer]

+1

[omefire]

Thank you all for the suggestions.

So far, here's the list of snippets that are being added to VS:

• alert
• cl: console.log
• class
• do: do while
• else
• for
• forin
• forr
• function
• if
• iife : (function(x) { })();
• switch
• try
• while
• with

Please, let me know if you have further suggestions.