vscode 配置代码片段

vscode 配置代码片段

1. 左下角设置（齿轮）选择 用户 代码片段

2. 中间可以选择特定语言的文件以便于更好在合适的语言环境下进行识别匹配 也可以进行选择 全局代码片段

（这里以vue为例，找到vue 即可 会自动生成 vue.json文件）

3. 如下图所示 是默认提示以及样例

4. 键入代码片段

其中 \t 是表示 两个 空格

"vue1": {
        "prefix": "vue-scss",
        "body": [
            "<template>",
            "\t<div class= 'content' >",
            " ",
            "$1",
            "\t</div>",
            "</template>",
            "<script>",
            "import xx from ''",
            "export default {",
            "\tcomponents: {},",
            "\tdata() {",
            "\t\treturn {}",
            "\t},",
            "\tcreated() {},",
            "\tmounted() {},",
            "\tmethods: {},",
            "\tcomputed: {},",
            "\twatch: {}",
            "}",
            "</script>",
            "",
            "<style lang='scss' scoped>",
            "",
            "</style>",
            "$2",
        ],
        // "description": "vue template "
    },

5. 保存 之后在新建的文件中 键入

具体对应关系如图

---

大概就是这么个步骤，提高开发效率 ，增加摸鱼时间