vscode中vue3用户代码片段

vsCode中配置vue3代码片段

1.找到设置-配置用户代码片段

2.新建全局代码片段

3.配置代码片段，vvv是代码片段快捷键

{
	"Print to console": {
	"prefix": "vvv",  //代码片段的快捷键，自定义
	"body": [
            "<template>",
            "  <div>$0</div>",
            "</template>",
            "",
            "<script>",
	"import { reactive, toRefs,onBeforeMount,onBeforeUnmount,onMounted,onUnmounted,onUpdated,onBeforeUpdate} from 'vue'",
	"export default {",
	"name:'',",
	"setup(){",
	"const data = reactive({",
	"})",
	"onBeforeMount(()=>{",
	"})",
	"onMounted(()=>{",
	"})",
	"onBeforeUpdate(()=>{",
	"})",d
	"onUpdated(()=>{",
	"})",
	"onUnmounted(()=>{",
	"})",
	"onBeforeUnmount(()=>{",
	"})",
	"return {",
	"...toRefs(data),",
	"}",
	"}",
	}",
	"</script>",
	"<style scoped lang='less'>",
	"</style>"
        ],
	"description": "vue2 快速生成代码块"
	}
}

4.使用代码片段