vs code 添加vue单文件的快捷片段

在写vue项目时，经常需要创建一个vue单文件，然后写入vue单文件的基本结构：

<template lang='pug'>
    
</template>

<script>
export default {
    
}
</script>

<style lang='stylus' scoped>

</style>

每次都这样写非常繁琐，还好vs code 提供了自定义快捷片段（snippets）的功能。添加如上结构的快捷片段的步骤如下：

1. 点击文件=>首选项=>用户代码片段
2. 点击vue
3. 在json中添加如下代码：

    "vue with pug and stylus": {
        "prefix": "vue",
        "body": [
            "<template lang='pug'>",
            "\t$1",
            "</template>",
            "",
            "<script>",
            "export default {",
            "\t",
            "}",
            "</script>",
            "",
            "<style lang='stylus' scoped>",
            "",
            "</style>"
        ],
        "description": "vue single file snippet with pug and stylus used"
    }

保存之后，以后创建好vue文件，只需在里面输入vu两个字母，弹出智能提示里就会有这个片段，再按enter或tab就添加片段到光标处了。