vscode中如何快速生成vue3模板

511 阅读1分钟

最近在开发vue的项目时 ,公司新来的小伙伴总是问我各种各样的问题, 令我最印象深刻的就是

vscode中如何快速生成vue3模板

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

 export default {
 name:'',
 }
 </script>
 
 <style  scoped> 
 </style>
 

我一时间也忘了当时是怎么配置的了,于是乎我就翻看一下自己的配置文件,找到了vue的相关配置文件

image.png 在搜索栏中找到vue.json即可

image.png 看到如下代码片段

image.png

于是乎就回想起自己当时那会是怎么跟带公司带我的师傅一点一点的学习写代码的。

所以就把这个小技巧分享出来给大家,希望能够帮助到后面的人。明天就是北方的小年了,在这里祝大家小年快乐。 文末为为我的配置文件,有需要的请自行获取修改即可

{
	// Place your snippets for vue here. Each snippet is defined under a snippet name and has a prefix, body and
	// description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
	// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the
	// same ids are connected.
	
	"Print to console": {
		"prefix": "vue2",
		"body": [
			"<template>",
			"    <div>\n",
			"    </div>",
			"</template>",
			"<script>",
			"export default {",
			"   data() {",
			"      return {",
			"      }",
			"   },",
			"   created(){",
			"   },",
			"   computed:{",
			"   },",
			"   methods:{",
			"   },",
			"}",
			"</script>",
			"<style scoped>\n",
			"</style>",
			"$2"
		],
		"description": "Log output to console"
	}
}