写好一套.vue文件模板大大提高了我们的开发效率，欢迎使用！
方法：打开vscode — 文件 — 首选项 — 用户片段 — 新增 vue.json — 粘贴代码

{ 
	"vue": {
        "prefix": "VUE", // 触发的关键字
        "body": [
            "<template>",
            "  <div>",
            "    <MyComponents />$1",
            "  </div>",
            "</template>",
            "",
            "<script>",
            "// 接口模块，",
			"import { myapi } from '@/api/'",
            "// 组件模块，@=src,.=当前",
			"import MyComponents from '@/components/'",
            "// 混入模块，@=src,.=当前",
			"import mymixins from './mixins/'",
			"",
            "export default {",
			"  name: 'Name',",
            "  components: { MyComponents },",
            "  mixins: [mymixins],",
            "  props: {",
			"    value1: { type: String, default: '' },",
			"    value2: { type: Number, default: 1 },",
			"    value3: { type: Boolean, default: true },",
			"    value4: { type: Array, default: function() { return [] } },",
			"    value5: { type: Object, default: function() { return {} } }",
			"    value6: { type: Function, default: function() { return true } }",
            "  },",
            "  data() {",
            "    return {",
            "      data1: '',",
            "      data2: true,",
            "      data3: []",
            "    }",
            "  },",
            "  // 属性计算",
            "  computed: {",
			"    test: function() {",
			"      return this.data1",
			"    }",
	        "  },",
            "  // 监听器",
            "  watch: {",
			"    data1: function(newVal, oldVal) {",
			"      this.data2 = newVal",
			"    }",
        	"  },",
            "  // 创建之前（数据没有挂载，只是一个空壳，无法操作真实的DOM和访问数据）",
            "  beforeCreate() {",
            "",
            "  },",
            "  // 创建完成（可以访问当前this实例，获得初始数据，无法渲染DOM）",
            "  created() {",
            "",
            "  },",
            "  // 即将挂载（可以访问到DOM也可以访问原始数据）",
            "  beforeMount() {",
            "",
            "  },",
            "  // 挂载完成（可以访问DOM元素）",
            "  mounted() {",
            "    // 触发方法",
			"    this.getTest()",
            "    // 发送异步请求",
			"    myapi().then(res => {",
			"      console.log(res)",
			"    })",
            "  },",
            "  // 更新之前",
            "  beforeUpdate() {",
            "",
            "  },",
            "  // 更新之后",
            "  updated() {",
            "",
            "  },",
            "  // 销毁之前",
            "  beforeDestroy() {",
            "",
            "  },",
            "  // 销毁完成",
            "  destroyed() {",
            "",
            "  },",
            "  // 有keep-alive并且进入时",
            "  activated() {",
            "",
            "  },",
            "  // 有keep-alive并且离开时",
            "  deactivated() {",
            "",
            "  },",
            "  // 方法",
            "  methods: {",
			"    getTest() {",
			"      this.data1 = ''",
			"    }",
            "  }",
            "}",
            "</script>",
            "",
            "<style lang='scss' scoped>",
            "$4",
            "</style>"
            "",
        ],
        "description": "vh components"
	}
}

打开一个 .vue文件，点击右下角的Vue，选择语言模式：vue.json，试试在代码里面输入vue就弹出我们预设的模板了，快看看效果吧！

<template>
  <div>
    <MyComponents />
  </div>
</template>

<script>
// 接口模块，
import { myapi } from '@/api/'
// 组件模块，@=src,.=当前
import MyComponents from '@/components/'
// 混入模块，@=src,.=当前
import mymixins from './mixins/'

export default {
  name: 'Name',
  components: { MyComponents },
  mixins: [mymixins],
  props: {
    value1: { type: String, default: '' },
    value2: { type: Number, default: 1 },
    value3: { type: Boolean, default: true },
    value4: { type: Array, default: function() { return [] } },
    value5: { type: Object, default: function() { return {} } },
    value6: { type: Function, default: function() { return true } }
  },
  data() {
    return {
      data1: '',
      data2: true,
      data3: []
    }
  },
  // 属性计算
  computed: {
    test: function() {
      return this.data1
    }
  },
  // 监听器
  watch: {
    data1: function(newVal, oldVal) {
      this.data2 = newVal
    }
  },
  // 创建之前（数据没有挂载，只是一个空壳，无法操作真实的DOM和访问数据）
  beforeCreate() {

  },
  // 创建完成（可以访问当前this实例，获得初始数据，无法渲染DOM）
  created() {

  },
  // 即将挂载（可以访问到DOM也可以访问原始数据）
  beforeMount() {

  },
  // 挂载完成（可以访问DOM元素）
  mounted() {
    // 触发方法
    this.getTest()
    // 发送异步请求
    myapi().then(res => {
      console.log(res)
    })
  },
  // 更新之前
  beforeUpdate() {

  },
  // 更新之后
  updated() {

  },
  // 销毁之前
  beforeDestroy() {

  },
  // 销毁完成
  destroyed() {

  },
  // 有keep-alive并且进入时
  activated() {

  },
  // 有keep-alive并且离开时
  deactivated() {

  },
  // 方法
  methods: {
    getTest() {
      this.data1 = ''
    }
  }
}
</script>

<style lang='scss' scoped>

</style>