快捷键快速生成vue组件的代码片段

.vue组件中输入vuec快速生成vue组件结构

<template>
  <div></div>
</template>

<script>
  export default {
}
</script>

<style lang="less" scoped>
</style>

vscode中安装插件

Vue 3 Snippets：设置代码片段，需要在vscode编辑器中配置代码：设置 ------> user snippets -----> vue.json,设置下面代码

（只有安装插件后，才会有vue.json文件。不安装插件没有vue.json）

Vetur： 设置vue文件代码高亮及格式化操作

{	//这是外部的括号
	"Create vue template": {
		"prefix": "vuec",
		"body": [
		 "<template>",
		 "  <div>$1</div>",
		 "</template>",
		 "",
		 "<script>",
		 "  export default {",
		 "}",
		 "</script>",
		 "",
		 "<style lang=\"less\" scoped>",
		 "</style>",
		 "",
		],
		"description": "Create vue template"
	}
}

然后在.vue组件中即可通过vuec创建组件结构