使用vscode，新建vue模板

第一步: 新建模板并保存

文件 --> 首选项 --> 用户代码片段 --> 输入vue，选择vue.json -->复制 第三步中的模板内容中内容保存

第二步: 添加配置，让vscode允许自定义的代码片段提示出来

文件 --> 首选项 --> 设置 ---> 添加这2项

// Specifies the location of snippets in the suggestion widget

"editor.snippetSuggestions": "top",

// Controls whether format on paste is on or off

"editor.formatOnPaste": true

第三步: 复制以下代码，保存重启vscode

{

     "Print to console": {

         "prefix": "vue",

         "body": [

             "<template>",

             " <div class= \" page \" > \n ",

             " </div>",

             "</template> \n ",

             "<script type= \" text/ecmascript-6 \" >",

             "export default {",

             " data() {",

             " return { \n ",

             " }",

             " },",

             " components: { \n ",

             " }",

             "}",

             "</script> \n ",

             "<style scoped lang= \" stylus \" >",

             "</style>",

             "$2"

        ],

         "description": "Log output to console"

    }

}

第四步:测试是否添加成功

测试方法： 新建vue后缀文件，输入vue，按下tab键，OK