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，回車或tab可得以下模板：

<!-- vue快捷建立組件 -->
<template>
  <div></div>
</template>

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

<style lang='stylus' scoped>

</style>
複製代碼

若是你喜歡使用Sass或Less,能夠把lang作相應調整

新模板第一行可備註組件相關內容，例：<!-- vue快捷建立組件 -->