需求描述
新建 vue 文件后,需要先寫出 vue3 的基礎架構代碼,手動輸入效率低下!
期待:輸入 v3 按 Tab 即刻生成自定義的vue3模板(如下圖)
實現流程
- vscode 的設置中,選擇 用戶代碼片段
- 輸入 vue 回車,打開 vue.json 文件
將其內容修改為
{"Print to console": {"prefix": "v3", //鍵入該值,按tab快捷產生"body": ["<script setup lang='ts'>","","</script>","","<template>"," <div>",""," </div>","</template>","","<style scoped lang='scss'>","","</style>",],"description": "vue3的ts模板"}
}
- prefix 的屬性值為輸入的快捷索引,如 v3
- body 的屬性值為自定義的vue3模板,可以根據自己的需求修改
- description 的屬性值為描述信息