VS Code 新建vue文件初始化模板

前言

    在使用VS Code进行vue开发的时候，我们可以充分现有的vue插件进行智能提示，可以提高开发效率，但是，在VS Code中新定义.vue文件时，生成的是空白的文件页，我们需要手动创建模板非常繁琐。

解决方法

    打开VS Code编辑器，依次选择“文件 -> 首选项 -> 用户代码片段”，此时，会弹出一个搜索框，我们输入vue，选择vue.json

    复制以下内容：

{
    "Print to console": {
        "prefix": "vue",
        "body": [
            "<template>",
            "",
            "</template>",
            "",
            "<script>",
            "export default {",
            "  name:'',",
            "  data(){",
            "   return {",
            "",
            "   }",
            "  }",
            "}",
            "</script>",
            "",
            "<style scoped>",
            "",
            "</style>",
            "$2"
        ],
        "description": "Vue模板"
    }

    说明：prefix ：表示生成对应预设代码的命令，body：对应生成的模板，description：模板说明

    我们在创建test.vue输入vue，选中提示为vue模板的智能提示，回车，即可创建模板。