Snippets in Visual Studio Code

Intro

对于重复性代码片段的输入，使用 Snippet 可以很大程度上提高开发效率。VSCode 内置了常见的 Snippet，此外支持用户自定义 Snippets，可以为不同的编程语言创建特定的代码片段。

个人常用片段包括：

• global: 时间戳，email etc.
• markdown: 一些 html code, callout, math, tabs 等

Creating Snippets

User Snippets

1. Open the Command Palette Ctrl+Shift+P
2. Type “Snippets” and select “Configure User Snippets”
3. Choose from:
   • New Global Snippets file
   • New Snippets file for specific language
   • Existing snippets file

Snippet Syntax

Ref: https://macromates.com/manual/en/snippets

"Print to console": {    "prefix": "log",    "body": [        "console.log('$1');",        "$2"    ],    "description": "Log output to console"}

Key components:

• prefix: The trigger text for the snippet
• body: The actual template content
• description: Helper text shown in IntelliSense

Snippet Variables

Common variables you can use:

• $1, $2: Tab stops
• ${1:default}: Placeholder with default text
• $0: Final cursor position
• $TM_FILENAME: Current file name
• $CURRENT_YEAR: Current year
• $CLIPBOARD: Contents of clipboard

My Snippets

个人积累了一些常用的 Snippets，托管在 dotfiles/application/vscode/snippets at main · Efterklang/dotfiles

Ref

Snippets in Visual Studio Code