DEV Community

Drozerah
Drozerah

Posted on

VSCode Snippet your ES6 template literals!

code
The more you use ES6 template literals into your console.log() - like I do -, the more you need your VSCode snippet! Do not repeat yourself writing the same template!

const greetings = "Hello"
console.log(`${greetings} the DEV community!`) // Hello the DEV community!

Creating your own snippet with VSCode is easy:

VSCode > File > Preferences > User Snippets > New Global Snippets file

then, select the language you want the snippet to be available for, JavaScriptin our case, copy and past your snippet syntax as .json format:

{}javascript.json VSCode file

//...
"Template literals to console": {
    "prefix": "clgt",
    "body": [
        "console.log(` ${$0}`)"
    ],
    "description": "Template literals to console"
}
//...

This is it !

Now, in any .js file you are working on, simply type the snippet prefix clgt an press Tab to insert a new snippet into your code. Don't forget to enable the tab completion of your editor first "editor.tabCompletion": "on".

Tip => snippet generator

Next step?

Have fun & Be creative!

Thanks for reading!

See you next time!

Drozerah

Top comments (0)