自动生成代码片段(提升开发效率篇)

html:5 看到这个有木有种熟悉的感觉,通过在html文档输入html:5按下tab直接生成代码片段，对这就是快感！

来看看下面这个模版，这是vue中常见的开发模版，虽然能快捷生成每一个标签，但是对于重复繁琐的事情我们总会想到一个问题 => 能不能把事情做到高内聚低耦合。

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

<script>
export default {
    
}
</script>

<style>

</style>

在vs code中可自定义这样的配置，command + shift + p 打开命令版，输入 Preferences: Configure User Snippets

然后输入vue点击vue.json(Vue)，初次进入也许没有vue.json这个文件，可以点vue进入

进入后在vue.json内自己配置想要生成的模版

"Print to console": {
    "prefix": "v:5",
    "body": [
		"<template>",
		"",
		"",
		"</template>",
		"",
		"<script>",
		"",
		"export default {",
		"",
		"}",
		"</script>",
		"",
		"<style>",
		"",
		"</style>"
	],
	"description": "vue code"
}

之后通过v:5 就可生成模版