Oscar the owl and Vershd logo
Menu

12 TypeScript Visual Studio Code Snippets

Visual Studio Code is a great tool by Microsoft, but code snippets are a hidden gem within it that can really accelerate your software coding speeds. Here we have a wide selection of Visual Studio code snippets to help you get further as a developer.

Any user of VS Code will benefit from from these code snippets, from beginner to advanced. Some are very simple, but even cutting back on the number of curly brackets you type in your lifetime can save you time.

Print to the console with a variable

"Print to console with variable": {
"scope": "typescript",
"prefix": "csLog",
"body": ["console.log('$1: ', $2)$0"],
"description": "Log output to console"
}

If / else statement

"If else": {
"scope": "typescript",
"prefix": "csIfElse",
"body": ["if ($1) {", "\t$2", "}", " else {", "\t$3", "}", "", "$0"],
"description": "If / else statement"
}

If statement

"If": {
"scope": "typescript",
"prefix": "csIf",
"body": ["if ($1) {", "\t$0", "}"],
"description": "If statement"
}

Else statement

"Else": {
"scope": "typescript",
"prefix": "csElse",
"body": [" else $1{", "\t$0", "}"],
"description": "Else statement"
}

Property with a backing field

"Property with a backing field": {
"scope": "typescript",
"prefix": "csProp",
"body": [
"private $1Private: $0",
"",
"public get $1(): $0 {",
"\treturn this.$1Private",
"}",
"",
"public set $1(value: $0) {",
"\tthis.$1Private = value",
"}"
],
"description": "Property with a backing field"
}

Field variable

"Field": {
"scope": "typescript",
"prefix": "csField",
"body": ["${1|private,public|} ${2:FieldName}${3|: boolean,: string|,: number|,: date|}"],
"description": "Field (class level)"
}

Class constructor

"Constructor": {
"scope": "typescript",
"prefix": "csConstructor",
"body": ["constructor() {", "\tsuper()", "\t$0", "}"],
"description": "Constructor statement"
}

Export class

"Export class": {
"scope": "typescript",
"prefix": "csClass",
"body": [
"/**",
" *",
" *",
" * @export",
" * @class $1",
" */",
"export class $1 {",
"\tconstructor() {",
"\t\t$0",
"\t}",
"",
"}"
],
"description": "Export class"
}

Import Node module

"Import node module": {
"scope": "typescript",
"prefix": "csImport",
"body": ["import * as $2 from '$1'$0"],
"description": "Import node module"
}

For... loop

"For loop": {
"scope": "typescript",
"prefix": "csFor",
"body": ["for (let ${1:i} = 0; ${1:i} < $2; ${1:i}++) {", "\t$0", "}"],
"description": "For loop"
}

Class method

"Method": {
"scope": "typescript",
"prefix": "csMethod",
"body": [
"${1|private,public|} ${2| ,async|} ${3:MethodName}($4)${5| ,: Promise|} {",
"\t$0",
"}"
],
"description": "Method"
}

Try... catch block

"Try / catch": {
"scope": "typescript",
"prefix": "csTryCatch",
"body": ["try {", "\t$1", "}", "catch (error) {", "\t$0", "}"],
"description": "Try / catch block"
}

Try... finally block

"Try / finally": {
"scope": "typescript",
"prefix": "csTryFinally",
"body": ["try {", "\t$1", "}", "finally {", "\t$0", "}"],
"description": "Try / finally"
}

Conclusion

These Visual Studio Code snippets will help you to crank out code more frequently, and produce more benefits for your customers. Use these TypeScript VS Code snippets whenever you want to shave even just a little time off your development.

Free

GitBreeze is an effortless Git GUI that's free for use at work, at home, anywhere. It boosts software development. It works on Windows, macOS, and Linux.

Designed for developers who want Git to be simple, our unique UI/UX boosts your software development - learn more and reap the benefits.

Coding help

Designed to improve your software development life, this is a full list of our coding help pages.

There's more to assist you, with Git tips and best software development practices, on our resources page.

We also have this free download to help with Git - our Git cheat sheet

Customers say...

I love any tool that makes my life easier... This is perfect, just the right amount of control. No more, no less. Easy to get started, push and rollback changes... It's a no brainer!
Hayden T.
Oscar the owl and Vershd logo
 © 2024 GitBreeze Ltd.
St. George's flag of England, the Union Jack flag of the United Kingdom, the European Union flag, and the United Nations flag.
chevron-right linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram