vsCode中如何使用快捷键创建vue默认组件

• 打开Visual Studio Code;
• 文件-->首选项-->用户代码片段-->输入框输入vue.json;
• 将如下代码复制到文件中：

{
  "Print to console": {
    "prefix": "vue",
    "body": [
      "<!-- $0 -->",
      "<template>",
      "  <div></div>",
      "</template>",
      "",
      "<script>",
        "export default {",
        "  data () {",
        "    return {",
        "    }",
        "  }",
        "}",
        "",
      "</script>",
      "",
      "<style lang='stylus' scoped>",
      "",
      "</style>",
      ""
    ],
    "description": "Log output to console"
  }
}

• 然后新建.vue文件，输入vue，回车如下：

<!-- vue快捷创建组件 -->
<template>
  <div></div>
</template>

<script>
export default {
  data () {
    return {
    }
  }
}

</script>

<style lang='stylus' scoped>

</style>

如果你喜欢使用Sass或Less,可以把lang做相应调整

新模板第一行可备注组件相关内容，例：<!-- vue快捷创建组件 -->