VScode（工具篇）=> 自动生成 vue模板教程

vscode自动生成vue模板步骤

step1：
文件-首选项-用户代码片段，输入vue，点击enter后进入vue.json文件，将下方代码完全覆盖掉以前内容，保存

PS：User snippets点击查找vue.json即可

step2:测试

新进test.vue文件，在vue文件中输入vue，点击enter / tab 就能自动生成模板了，如果想调整模板内容，在vue.json中修改

下面是我的配置文件，大家可以根据自己的选择配置

{
	"Print to console": {
	"prefix": "vue",
	"body": [
	"<!-- 组件说明 -->",
	"<template>",
	"\t<div class=''>\n\t\t$2\n\t</div>",
	"</template>",
	"",
	"<script>",
	"\t//import x from ''",
	"\texport default {",
	"\t\tcomponents: {",
	"",
	"\t\t},",
	"\t\tdata () {",
	"\t\t\treturn {",
	"",
	"\t\t\t};",
	"\t\t},",
	"\t\tcomputed: {",
	"",
	"\t\t},",
	"\t\tmethods: {",
	"",
	"\t\t},",
	"mounted() {",
	"",
	"},",
	"beforeCreate() {}, //生命周期 - 创建之前",
	"beforeMount() {}, //生命周期 - 挂载之前",
	"beforeUpdate() {}, //生命周期 - 更新之前",
	"updated() {}, //生命周期 - 更新之后",
	"beforeDestroy() {}, //生命周期 - 销毁之前",
	"destroyed() {}, //生命周期 - 销毁完成",
	"activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发",
	"\t}",
	"</script>",
	"",
	"<style lang='scss' src=''>",
	"</style>"
	],
	"description": "vue output to vue-template"
	}
}