vscode设置代码片段，自动生成代码模板

设置用户代码片段教程

废话不多说，先看效果图：

接下来就讲讲怎么设置自动生成代码。
步骤1：

步骤2：

这里我以typescript为例。
步骤3：

{
    "define a property and its getter/setter": { // 代码段名称
        "prefix": "_prop", // 代码段前缀
        "body": [ // 代码段内容
            "private ${1:value}: ${2:string};", //$1表示光标落点,可以设置多个相同的落点 ${1:value}表示光标处默认内容为value
            "public get${3:Value}(): ${2:string} {",
            "\treturn this.${1:value};", // \t表示内容缩进一个tab空格
            "}",
            "public set${3:Value}(v: ${2:string}): void {",
            "\tthis.${1:value} = v;",
            "}"
        ],
        "description": "定义一个属性及其getter / setter"
    },
}

设置完成后保存文件即可。
步骤4：
如何使用：
新建一个ts文件，输入prop后，会有菜单栏提示，选择prop后，按下tab键后自动生成代码，修改完成后，再按下tab键，即可进入下一个光标位置进行输入。

其他类型的文件也可以自定义代码片段，各位根据自己需求去扩展。

代码片段模板

{
    "define a property and its getter/setter": { // 代码段名称
        "prefix": "_prop", // 代码段前缀
        "body": [ // 代码段内容
            "private ${1:value}: ${2:string};", //$1表示光标落点,可以设置多个相同的落点 ${1:value}表示光标处默认内容为value
            "public get${3:Value}(): ${2:string} {",
            "\treturn this.${1:value};", // \t表示内容缩进一个tab空格
            "}",
            "public set${3:Value}(v: ${2:string}): void {",
            "\tthis.${1:value} = v;",
            "}"
        ],
        "description": "定义一个属性及其getter / setter"
    },
    "export class ClassName": { // 代码段名称
        "prefix": "_class", // 代码段前缀
        "body": [ // 代码段内容
            "export class  ${1:ClassName}{",
            "$2",
            "}"
        ],
        "description": "定义一个类"
    },
    "export class ClassName extends SuperClass": { // 代码段名称
        "prefix": "_class e", // 代码段前缀
        "body": [ // 代码段内容
            "export class  ${1:ClassName} extends ${2:SuperClass}{",
            "$3",
            "}"
        ],
        "description": "定义一个继承父类的类"
    },
    "export class ClassName implements Interface": { // 代码段名称
        "prefix": "_class i", // 代码段前缀
        "body": [ // 代码段内容
            "export class  ${1:ClassName} implements ${2:Interface}{",
            "$3",
            "}"
        ],
        "description": "定义一个实现接口的类"
    },
    "export class ClassName extends SuperClass implements Interface": { // 代码段名称
        "prefix": "_class ei", // 代码段前缀
        "body": [ // 代码段内容
            "export class  ${1:ClassName} extends ${2:SuperClass} implements ${3:Interface}{",
            "$4",
            "}"
        ],
        "description": "定义一个继承父类并实现接口的类"
    },
    "export interface InterfaceName": { // 代码段名称
        "prefix": "_inter", // 代码段前缀
        "body": [ // 代码段内容
            "export interface ${1:ClassName}{",
            "$2",
            "}"
        ],
        "description": "定义一个接口"
    },
}

演示效果