VScode创建.vue的模板和新建vue页面步骤

VScode创建.vue的模板步骤

1. 安装VueHelper扩展，安装后重启以下vscode
   

2. 打开用户代码片段
   方法一：Ctrl+Shift+P打开命令输入 snippets; 在搜索框输入vue选择‘vue.json’。
   方法二：文件 → 首选项 → 用户代码片段 → 在搜索框输入vue选择‘vue.json’。
   

3. 清空内容，输入模板，具体格式如下（可根据自己的喜好进行修改） 其中$0代表模板生成后，光标停留的位置。

{
		"Print to console": {
			"prefix": "vue",
			"body": [
				"<template>",
				" <div>\n",
				" </div>",
				"</template>\n",
				"<script>",
				" export default {",
				"   data () {",
				"     return {\n",
				"     }",
				"   },",
				"   components: {\n",
				"   }",
				" }",
				"</script>\n",
				"<style>\n",
				" ",
				"</style>",
				"$2"
			],
			"description": "Log output to console"
		}
}

4. 新建vue文件，输入vue按Tab键模板代码就出来了。