
If you use a framework, such as React or Angular, there are lots of snippets that you are going to want to create. It’ll work with any language and is completely free. It’s really easy to use and lets you quickly create snippets that you can just copy and paste straight into your snippet files.
#VSCODE SNIPPETS GENERATOR#
Snippet Generator is a site that lets you paste in some code and easily convert it into snippet format. This also means you can have the same prefix produce different snippets based on the file type you’re currently working in! But don’t worry, you can still add global snippets if you want to be able to use them in any file type. If you are writing a HTML file, you won’t get all of your JavaScript or Python snippets. The great thing about VS Code snippets is that they can be locked to a specific file type. We chose JavaScript, but you could have chosen any of the other 44 languages. When we first opened the snippet editor, we were presented with a list of languages. You can have multiple tab points spread throughout the code, meaning you can quickly and easily populate your snippet without having to click or arrow-key to each point. This key points to an object with a prefix, body and description. To create our snippet, we need to create a new key in the object. const handle = prom => prom.then(res => ).catch(err => ) It’s a nice pattern for promise handling. This snippet is one that is my favourite line of code.
#VSCODE SNIPPETS HOW TO#
There is a comment showing you how to create a basic snippet, but we’re going to create our own. Selecting ‘Configure User Snippets’ presents you with a list of coding languages that you can create a snippet for.

In VS Code, press ctrl+shift+P to open the command palette and search for snippet. Its inbuilt code snippets can be configured to do much more than just pasting the code.īefore we talk about the fancy features, we’ll learn how to create a snippet.

VS Code has a system that is more powerful than even TextExpander or AutoHotKeys. These are great and can save you loads of time… but we can take it one step further. The next step was tools such as TextExpander or AutoHotKeys, where special key sequences could be set up to paste code snippets into wherever you were typing. But one-liners were often quicker to type than to search for the file, copy it and paste it in. This was great for large snippets of code.

The problem with a lot of existing systems is that these snippets were often stored in text files or other file systems and needed to be manually copied and pasted into wherever they were needed. For years, people have used code snippets to save time - whether they are common functions, file structures or even templates for whole systems.
