VS Code添加自定义snippet（代码段），附详细配置

Add code snippets for CLANG in VS Code

日志：

• 2017.10.11 VSCode 自 v1.17 起，其代码段引擎开始支持变量转换（variable transformations）特性，变量的值可以经过格式化处理后，再插入预定的位置。这是一个很强大的特性。另外，也不知道从什么时候开始，VSCode 开始支持 Choice 了。本次更新即旨于介绍这些新特性。

前记：今天试着用了下 Atom，发现 Atom 居然预装了 CLANG 的 snippets，而且远比 VSCode 的已有拓展「C/C++ Snippets」中的丰富！身为 VSCode 的死忠粉，我决定立马把 Atom 的 C snippets 搬到 VSCode 上来。

 

• Add code snippets for CLANG in VS Code
  • 什么是 snippet
  • 如何配置 snippet
    • 1 操作流程
    • 2 VSCode 中 snippet 的文法
      • 21 引子
      • 22 详细文法
      • 23 拓展阅读
    • 3 有用的建议
  • 附录

 

既然你点开了这个页面，那就说明要么你不知道 VSCode 上已有拓展「C/C++ Snippets」，要么你对这个拓展不甚满意。对于后者，本文将为你介绍如何在 VSCode 上设置 snippets，并为你提供一套可以直接用的 C 语言 snippets。

1. 什么是 snippet

snippet[ˈsnɪpɪt]，或者说「code snippet」，也即代码段，指的是能够帮助输入重复代码模式，比如循环或条件语句，的模板。通过 snippet ，我们仅仅输入一小段字符串，就可以在代码段引擎的帮助下，生成预定义的模板代码，接着我们还可以通过在预定义的光标位置之间跳转，来快速补全模板。

当然，看图更易懂。下图将 aja 补全为 JQuery 的 ajax() 方法，并通过光标的跳转，快速补全了待填键值对：

2. 如何配置 snippet

2.1. 操作流程

• 进入 snippet 设置文件，这里提供了两种方法： 
  • 摁「Alt」键切换菜单栏，通过文件 > 首选项 > 用户代码片段，选择进入目的语言的代码段设置文件；
  • 通过快捷键「Ctrl + Shift + P」打开命令窗口（all command window），输入「snippet」，通过候选栏中的选项进入目的语言的代码段设置文件。
• 填写 snippets

2.2. VSCode 中 snippet 的文法

2.2.1 引子

设置文件头部的一个块注释给出了设置 snippet 的格式，了解过「json」就不会对此感到奇怪。

 // Place your snippets for C here. Each snippet is defined under a snippet name and has a prefix, body and 
 // description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
 // $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the 
 // same ids are connected.
 // Example:
 "Print to console": {
    "prefix": "log",,
    "body": [
        "console.log('$1');",
        "$2"
    ],
    "description": "Log output to console"
}

注：上例定义了一个名为「Print to console」的 snippet，其功能为：在输入 log 并确认后，可将原文本替换为console.log('');。效果预览如下：