访问地址：https://snippet-generator.app/?description=&tabtrigger=&snippet=&mode=vscode

一 vue2

 

<template>
  <div>

  </div>
</template>

<script>
export default {
  name: '',
  data() {
    return {

    }
  },
  methods: {

  }
}
</script>

<style lang="less" scoped>

</style>

二 vue3

<template>

</template>

<script setup lang="ts">

</script>

<style lang="less" scoped>

</style>

 三 vscode配置

设置  -  配置用户代码片段

找到vue.json

 

 

{
	"vue": {
		"prefix": "vue",
		"body": [
			"<template>",
			"  <div>",
			"    ",
			"  </div>",
			"</template>",
			"",
			"<script>",
			"export default {",
			"  name: '',",
			"  data() {",
			"    return {",
			"",
			"    }",
			"  },",
			"  methods: {",
			"",
			"  }",
			"}",
			"</script>",
			"",
			"<style lang=\"less\" scoped>",
			"",
			"</style>"
		],
		"description": ""
	},

	"vue3": {
		"prefix": "vue3",
		"body": [
			"<template>",
			"",
			"</template>",
			"",
			"<script setup lang=\"ts\">",
			"",
			"</script>",
			"",
			"<style lang=\"less\" scoped>",
			"",
			"</style>"
		],
		"description": ""
	}
}

四 使用

选择要创建得模板