vscode中配置代码片段

步骤如下：

1. 设置->用户代码片段
   
2. 新增全局代码片段
   
3. 起全局代码片段文件名“xxx.code-snippets”
   这里以配置vue2初始代码片段为例
   
4. 配置具体代码片段
   按enter进入文件配置，以下是vue2的代码片段示例，具体可以自己随意配置

{
	"Print to console": {
		"prefix": "vue2",
		"body": [
			"<template>",
			"  <div>",
			"",
			"  </div>",
			"</template>",
			"",
			"<script>",
			"export default {",
			"  data() {",
			"    return {",
			"",
			"    }",
			"  },",
			"  created() {",
			"",
			"  },",
			"  mounted() {",
			"",
			"  },",
			"  methods: {",
			"",
			"  },",
			"}",
			"</script>",
			"<style scoped lang='scss'>",
			"",
			"</style>"
		],
		"description": "Log output to console"
	}
}

5. 使用
   新建一个vue文件，开始输入vue，vscode会有提示的
   
   
   这就ok拉

下面在赠送一波vue3的代码片段吧

{
  "Print to console": {
    "prefix": "vue3",
    "body": [
      "<template>",
      "  <div $1></div>",
      "</template>",
      "",
      "<script setup>",
      "import { ref, onMounted } from 'vue';",
      "import { useRoute, useRouter } from 'vue-router';",
      "const route = useRoute();",
      "const router = useRouter();",
      "onMounted(() => {",
      "  //console.log('3.-组件挂载到页面之后执行-------onMounted')",
      "})",
      "</script>",
      "<style scoped lang='scss'>",
      "</style>"
    ],
    "description": "Log output to console"
  }
}