配置vue3模板和vscode Wrap with Abbreviation

问题一

我不想安装插件又想输入vue3立即生成代码模板，可以按这样的步骤配置：

vscode配置步骤：

• 输入Ctrl Shift p
• 输入Preferences: Configure User Snippets
• 输入vue，点击进入vue.json

配置如下：

{
  "Vue 3 Template": {
    "prefix": "vue3",
    "body": [
      "<template>",
      "  <div></div>",
      "</template>",
      "",
      "<script setup>",
      "</script>",
      "",
      "<style scoped>",
      "</style>"
    ],
    "description": "Vue 3 basic template with script setup"
  }
}

完成！！(ㆆᴗㆆ)

问题二

此时我又遇到一个问题：我写了一段代码，但是现在想要在这部分代码外包裹一层<router-link></router-link>。 可以使用Emmet: Wrap with Abbreviation快速实现，不过这个功能没有快捷键，我们可以自定义设置快捷键shift+alt+w。

1. 输入ctrl+k 和 ctrl+s进入vscode快捷键设置，输入Wrap with Abbreviation
2. 点击左边的铅笔样式的图标配置快捷键
3. 测试是否可以正常使用

选中需要包裹的代码

按下快捷键shift+alt+w

输入router-link自动变成html标签包裹选中的代码

完成！！(ㆆᴗㆆ)