Skip to content
Go back

vscode-代码模板

Edit page

vscode-代码模板

打开配置窗口

路径:File > Preferences > User Snippets

picture 28

编写配置文件

实例:

{
  "blog header": {
    "prefix": "blogheader",
    "body": [
      "---",
      "title: ${1:${TM_FILENAME_BASE}}",
      "date: ${CURRENT_YEAR}-${CURRENT_MONTH}-${CURRENT_DATE}",
      "tags: [$2]",
      "categories: ",
      "    - [$3]",
      "---",
      "# $0"
    ],
    "description": "insert blog header"
  }
}

下面说明各项作用:

prefix

触发前缀,代码模板的前置引导;

body

实际插入的代码片段,一行一个字符串,组成一个数组

指针跳转顺序

$1 , $2 , 数字代表指针跳转顺序, $0 ,代表最后指针所处的位置;

默认值 placeholder

${1: placeholder} ,数字代表指针跳转顺序,后面的文字代表默认值;

可选项 choice

${1|one, two, three|} ,数字代表指针跳转顺序,后面的各项代表可选的输入项;

常用变量汇总

还可以用正则表达式格式化输出

补充说明

如果配置好后,代码模板没有生效,有可能时 vscode 的对应文件的 quickSuggestions 没开。 打开方式: ctrl + shift + P 在弹出的命令检索框上搜索 settings json 得到 vscode 的 settings.json 文档 在文档内插入:

"[markdown]": {
    "editor.quickSuggestions": true
},

需要什么语言的支持,就在中括号内输入什么语言,还可以添加自定义的文件支持,比如对 xxx.todo

"[todo]":{
    "editor.quickSuggestions": true
}

Edit page
Share this post on:

Previous Post
vscode-keymap设置
Next Post
前端开发规范-CSS篇