vue开发中如何使用自定义代码片段

vue开发中如何使用自定义代码片段

左下角设置点击代码片段，输入vue搜索打开vue.json文件

我这里使用了 vue2和vue3的代码片段，使用快捷键直接输入vue模板

 
{
	"Print to console": {
	  "prefix": "vue3",
	  "body": [
		"<template>",
		"  <div class=\"\"></div>",
		"</template>\n",
		"<script setup lang='ts' name=''>",
		"</script>\n",
		"<style scoped></style>",
		"$2"
	  ],
	},
	"Print Hello Vue": {
        "prefix": "vue",
        "body": [
            "<template>",
            "  <div>",
            "    Hello, Vue 2!",
            "  </div>",
            "</template>",
            "",
            "<script>",
            "export default {",
            "  name: 'HelloVue',",
            "  data() {",
            "    return {};",
            "  },",
            "};",
            "</script>",
            "",
            "<style scoped>",
            "/* Your styles here */",
            "</style>"
        ],
        "description": "Create a simple Vue component that prints 'Hello, Vue 2!'"
    },
    "Vue Component": {
        "prefix": "vcomp",
        "body": [
            "<template>",
            "  <div class=\"$1\">",
            "    $0",
            "  </div>",
            "</template>",
            "",
            "<script>",
            "export default {",
            "  name: '$2',",
            "  props: {",
            "    // define your props here",
            "  },",
            "  data() {",
            "    return {",
            "      // your data here",
            "    };",
            "  },",
            "  methods: {",
            "    // your methods here",
            "  },",
            "  computed: {",
            "    // your computed properties here",
            "  },",
            "  watch: {",
            "    // your watchers here",
            "  },",
            "  mounted() {",
            "    // your mounted lifecycle hook here",
            "  }",
            "};",
            "</script>",
            "",
            "<style scoped>",
            "/* Your styles here */",
            "</style>"
        ],
        "description": "Create a basic Vue 2 component structure."
    }
  }
  

有需要的拿走不谢。