vscode中快捷生成自定义vue3模板

需求描述

新建 vue 文件后，需要先写出 vue3 的基础架构代码，手动输入效率低下！

期待：输入 v3 按 Tab 即刻生成自定义的vue3模板（如下图）

实现流程

1. vscode 的设置中，选择 用户代码片段
   

1. 输入 vue 回车，打开 vue.json 文件
   
   将其内容修改为

{
  "Print to console": {
    "prefix": "v3",  //键入该值，按tab快捷产生
    "body": [
      "<script setup lang='ts'>",
      "",
      "</script>",
      "",
      "<template>",
      "  <div>",
      "",
      "  </div>",
      "</template>",
      "",
      "<style scoped lang='scss'>",
      "",
      "</style>",
    ],
    "description": "vue3的ts模板"
  }
}

• prefix 的属性值为输入的快捷索引，如 v3
• body 的属性值为自定义的vue3模板，可以根据自己的需求修改
• description 的属性值为描述信息