还在一行行敲代码吗?一起自定义vscode快捷输入吧!

前言

博主原来是使用 idea 的后来听说 vscode 不错,就上手试了试,这个界面真的爱了。
但是已经习惯了 idea 的快捷键和智能感知,今天抽时间配置了一下智能感知。

打开 json 文件

还在一行行敲代码吗?一起自定义vscode快捷输入吧!_第1张图片

快捷键:ctrl + shift + p
输入:snippets

然后在这里输入想要配置的语言,这里使用 JavaScript 作为示范
还在一行行敲代码吗?一起自定义vscode快捷输入吧!_第2张图片

参数说明

  • prefix:快捷输入的入口。
  • body:快捷输入的代码体,输入入口的字符后按回车自动呈现的代码,字符串间换行的话使用 \r\n 换行符隔开。如果有特殊字符需要进行转义,多行代码以 ,分隔。
  • $0:光标最终的位置。
  • $1 - $n:每次按下 tab 光标跳转的位置,起始位置为 $1
  • description:代码段描述,智能感知时的描述,当定义的快捷输入过多时的提示。

这里给出示例:

"Print to console": {
     
	"prefix": "log",
	"body": [
	"console.log($1);"
	],
	"description": "Log output to console"
}

当我们敲入 log 时按回车代码自动完成,效果如下:

还在一行行敲代码吗?一起自定义vscode快捷输入吧!_第3张图片

下面为我的快捷键用来参考:

{
     
    "function": {
     
        "prefix": "fn",
        "body": [
            "function $1($2) {\r\n\t$3\r\n}"
        ],
        "description": "function () {}"
    },
    "console.log": {
     
        "prefix": "log",
        "body": [
            "console.log($1);"
        ],
        "description": "console.log()"
    },
    "alert": {
     
        "prefix": "al",
        "body": [
            "alert($1);"
        ],
        "description": "alert()"
    },
    "class": {
     
        "prefix": "cl",
        "body": [
            "$('.$1')"
        ],
        "description": "class"
    },
    "id": {
     
        "prefix": "id",
        "body": [
            "$('#$1')"
        ],
        "description": "id"
    },
    "on": {
     
        "prefix": "on",
        "body": [
            "on('click',function () {\r\n\t$1\r\n})"
        ],
        "description": "on"
    },
    "for": {
     
        "prefix": "fo",
        "body": [
            "for (var i = 0; i < $1; i++) {\r\n\t$2\r\n}"
        ],
        "description": "for"
    },
    "if": {
     
        "prefix": "ifif",
        "body": [
            "if ($1) {\r\n\t$2\r\n}"
        ],
        "description": "if"
    }
}

你可能感兴趣的:(开发工具,开发工具,visual,studio,code,编辑器)