VSCode snippets实现智能提示

Code snippets：Code snippets are templates that make it easier to enter repeating code patterns, such as loops or conditional-statements.

1.什么是Snippets

指的是能够帮助输入重复代码模式串，比如循环或条件语句的模板。通过snippet，仅仅输入一小段代码就可以生成预定义的模板代码，甚至可以通过内部跳转快速补全模板。

2. 在VSCode 上配置snippets

2.1 Code -> 首选项 -> 用户代码片段

图 1

选择需要制作snippets 的目标语言

图 2

选择Javascript 语言

图 3

2.2 通过快捷键 command ＋ shift ＋ p 显示所有命令

图 4

输入snippets 从而进入snippets 配置页面

图 2

3. 配置snippets

    // Place your snippets for JavaScript 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"
    },

snippet由三部分组成：
prefix：前缀，定义了snippets 从IntelliSense中呼出的关键字;
body： 主体，即模板的主体内容，每个字符串表示一行;
description：说明，会在IntelliSense候选栏中出现。未定义的情况下显示对象名，上例中将会显示Print to console。

参照：VScode 官网snippets配置