在vscode中添加vue模板

在vscode中使用快捷键添加vue模板

vscode中使用vue框架时，每次新建的vue文件都需要把输入一些相同的代码，在这里，我们可以使用输入vue+enter快速生成vue模板。

一、配置vue.json文件

点击左上角"文件（file）",选择“首选项（Preferences）”,点击"用户代码片段（User snippets）"，在搜索框输入vue.json。

打开vue.json文件之后，在{}里添加以下内容。

代码如下（示例）：

"Print to console": {
	"prefix": "vue",
	"body": [
		"<template>",
		"  <div></div>",
		"</template>",
		"",
		"<script>",
		"export default {",
		"  name: '',",
		"  data() {",
		"    return {",
		"    };",
		"  },",
		"  methods: {",
		"},",
		"  mounted(){",
		"},",
		"};",
		"</script>",
		"",
		"<style scoped>",
		"",
		"</style>",
		"",
	],
	"description": "Log output to console"
}

保存之后，则可使用vue+enter生成vue模板了。

二、vsCode修改为vue语言

如果以上步骤设置好还未能实现，有可能是未替换成vue语言。
图片如下（示例）：