search.png
关于我
menu.png
vscode 快捷输入配置

vscode ctrl + shift + p,搜索snippets

在这里插入图片描述
在这里插入图片描述

选中第一个,再选择New Global Snippets file...
在这里插入图片描述
在这里插入图片描述

输入名字
在这里插入图片描述
在这里插入图片描述

vscode会创建一个xxx.code-snippets文件

{
    // Place your global snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and 
    // description. Add comma separated ids of the languages where the snippet is applicable in the scope field. If scope 
    // is left empty or omitted, the snippet gets applied to all languages. The prefix is what is 
    // used to trigger the snippet and the body will be expanded and inserted. Possible variables are: 
    // $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. 
    // Placeholders with the same ids are connected.
    // Example:
    "vue3": {
       // 支持快捷输入的文件后缀
        "scope": "vue",
        // 快捷输入的文字前缀
        "prefix": "vue3",
        // 生成的代码
        "body": [
            // 每一个字符串是独立的一行
            "<template>",
            "\t<div>",
            "\t\t",
            "\t</div>",
            "</template>",
            "",
            "<script lang='ts'>",
            "import { defineComponent } from \"vue\";",
            "",
            "export default defineComponent({",
            // $1指定第一个输入位置
            "\tname: '$1',",
            "\tsetup() {",
            // $2指定第二个输入位置,以此类推
            "\t\t$2",
            "\t\treturn {",
            "\t\t\t",
            "\t\t}",
            "\t},",
            "})",
            "</script>",
            "",
            "<style>",
            "</style>",
        ],
        "description": "vue3基础代码结构"
    }
}

一切尽在代码中。

版权声明

知识共享许可协议 本文章由作者“衡于墨”创作,转载请注明出处,未经允许禁止用于商业用途

本作品采用 知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议 进行许可。
发布时间:2021年02月19日 10:43:36

评论区#

还没有评论哦,期待您的评论!

关闭特效