vscode创建vue3的代码块

{
  "Print to console": {
    "prefix": "vue3",
    "body": [
      "<template>",
      "  <div></div>",
      "</template>",
      "",
      "<script>",
      "import { reactive, toRefs, onBeforeMount, onMounted } from 'vue'",
      "export default {",
      "  name: '',",
      "  setup() {",
      "    console.log('1-开始创建组件-setup')",
      "    const data = reactive({})",
      "    onBeforeMount(() => {",
      "      console.log('2.组件挂载页面之前执行----onBeforeMount')",
      "    })",
      "    onMounted(() => {",
      "      console.log('3.-组件挂载到页面之后执行-------onMounted')",
      "    })",
      "    return {",
      "      ...toRefs(data),",
      "    }",
      "  },",
      "}",
      "",
      "</script>",
			"",
      "<style scoped lang='scss'>",
      "</style>",
      
  ],
    "description": "Log output to console"
  }
}

然后再vscode中的vue文件中，输入vue3，敲回车就可以了

如何到这个设置页面，请看：vscode 设置vue 代码块_strong90的博客-优快云博客_vue代码块设置