vscode配置vue3代码片段模板

1.不使用setup语法糖的模板

{
	"Print to console": {
	  "prefix": "vue3-default",
	  "body": [
		"<template>",
		"  <div :class=\"\\$style['container']\">",
		"    $Index",
		"  </div>",
		"</template>",
		"",
		"<script lang=\"ts\">",
		"import {defineComponent} from \"vue\"",
		"",
		"export default defineComponent({",
		"name: \"$Index\",",
		"setup(){}",
		"})",
		"</script>",
		"",
		"<style lang=\"less\" module>",
		  " .container {",
		  " }",
		"</style>",
		""
	  ],
	  "description": "Log output to console"
	}
  }

2.使用setup语法糖

{
	"Print to console": {
	  "prefix": "vue3-setup",
	  "body": [
		"<template>",
		"  <div :class=\"\\$style['container']\">",
		"    $Index",
		"  </div>",
		"</template>",
		"",
		"<script setup lang=\"ts\">",
		"import {ref} from \"vue\"",
		"const a = ref(0)",
		"</script>",
		"",
		"<style lang=\"less\" module>",
		  " .container {",
		  " }",
		"</style>",
		""
	  ],
	  "description": "Log output to console"
	}
  }