vscode自定义snippet

点击编辑器左下脚 设置图标 -> User Snippets -> New Global Snippets file.. 创建全局 snippet ，也可以选择在当前项目下创建 snippet ，（选择 New Snippets file for '项目名'…）

然后就是编写 snippet 内容，vue3组件snippet示例如下：

{
    // Place your global snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and 
    // description. Add comma separated ids of the languages where the snippet is applicable in the scope field. If scope 
    // is left empty or omitted, the snippet gets applied to all languages. 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": {
    //  "scope": "javascript,typescript",
    //  "prefix": "log",
    //  "body": [
    //      "console.log('$1');",
    //      "$2"
    //  ],
    //  "description": "Log output to console"
    // }
    "vue3comp": {
        "scope": "vue",
        "prefix": "vue3comp",
        "body": [
            "<script setup lang=\"ts\">\n\n</script>\n\n<template>\n\n</template>\n\n<style lang=\"scss\" scoped>\n\n</style>",
        ],
        "description": "vue3 组件"
    }
}

最后在 .vue 文件中输入关键字 vue3comp 或简写 vue3，当自定义的 snippet 弹出来后按 Tab 或 Enter 键即可