vscode 配置vue2与vue3 代码片段

一、打开VSCode，右下角设置 -> 选择用户代码片段 -> 选择新建全局代码片段文件

二、输入快捷名称 如vue2，vue3

vue2代码片段

{
  "Print to console": {
    "prefix": "vue2",
    "body": [
      "<template>",
      "    <div>\n",
      "    </div>",
      "</template>",
      "<script>",
      "export default {",
      "   name:'',",
      "   components: {},",
      "   data() {",
      "      return {",
      "      }",
      "   },",
      "   watch: {},",
      "   computed: {},",
      "   created() {},",
      "   mounted() {},",
      "   methods:{",
      "   },",
      "}",
      "</script>",
      "<style lang=\"scss\" scoped>\n",
      "</style>",
      "$2"
    ],
    "description": "Log output to console"
  }
}

vue3片段

{
  "Print to console": {
    "prefix": "vue3",
    "body": [
      "<template>",
      "  <div></div>",
      "</template>",
      "",
      "<script setup lang='ts'>",
      "import { ref, reactive } from 'vue'",
      "",
      "</script>",
      "",
      "",
      "<style lang='scss' scoped>",
      "",
      "</style>"
    ],
    "description": "Log output to console"
  }
}

三、创建之后保存，创建一个.vue后缀文件在里面输入vue2或者vue3，按下回车代码就生成了