在vscode中,自定义代码片段,例vue组件的模板

时间:2023-03-09 21:50:07
在vscode中,自定义代码片段,例vue组件的模板

1----

在vscode中,自定义代码片段,例vue组件的模板

2----  输入vue,  选 vue.json

在vscode中,自定义代码片段,例vue组件的模板

3----  在vue.json中编辑, 有说明

  a.  tab符,要用空格, 也可以转义

在vscode中,自定义代码片段,例vue组件的模板

4----   新建vue文件, 输入自定义的关键字, 就出现了

在vscode中,自定义代码片段,例vue组件的模板

在vscode中,自定义代码片段,例vue组件的模板

5----  上图的 自定义的 vd 代码段

"demo": {
        "prefix": "vd",
        "body": [
            "<template>",
            " <div class=\"$1\">",
            " ",
            " </div>",
            "</template>",
            " ",
            "<script>",
            "export default {",
            " name: 'vueName',",
            " data () {",
            " return {",
            " msg:'Welcome to your vueName'",  
            " }",
            " }",
            "}",
            "</script>",
            " ",
            "<style scoped lang = \"sass\">",
            " ",
            "</style>"
        ],
        "description": "自定义的一个vue代码段,测试"
    }