1.ctrl+shift+p
2.输入 configure user snippets / 配置用户代码片段
3.选择Add browser Breakpoint / 新建全局代码片段文件
4.自定义json文件名,例如vue3.json
将以下内容复制进{}里,保存即可。
"Print to Vue&html base code": {
"prefix": "vh",
"body": [
"<template>",
" <div class=\"newVue\">",
" </div>",
"</template>",
"<script lang=\"ts\">",
"import {defineComponent,reactive,toRefs} from \"vue\";",
"export default defineComponent({",
" name: \"newVue\",",
" props: {},",
" setup() {",
" const state = reactive<any>({",
" });",
" return {",
" ...toRefs(state),",
" };",
" },",
"});",
"</script>",
"<style lang=\"scss\" scoped>",
".newVue {",
" width:100%;",
" height:100%;",
"}",
"</style>",
],
"description": "Vue&html base code"
}
当要使用模板时,输入"prefix"里自定义的指令,比如上面的指令是vh,输入vh再按enter即可。