为什么谈到Snippet

今天下午在用vscode做小程序的时候，发现很不方便，因为商店里提供的代码片段极为有限，而且平时几乎每天都需要用到代码片段，所以就在思考他们是怎么做到给别人提供代码的，我可以自定义代码片段吗。然后查了下，果然，这在vscode里自带的（好像藏得有点深），是可以自定义的，然后在做完自己的任务后捣鼓了下，基本了解了snippet的语法，突然有种打开新世界大门的感觉。做个记录，上菜了

如何打开snippet配置

这里以vscode为例，其他编辑器大概也差不多。在vscode中快捷键「Ctrl + Shift + P」打开命令窗口，然后输入snippet,选择 [配置用户代码片段]，点击后，就可以愉快的进行片段的编写了

Snippet怎么用

先上一个Demo

"html template": {

    "prefix": "ht",

    "body": [

      "<!DOCTYPE html>",

      "<html lang=\"en\">",

      "<head>",

      "  <meta charset=\"UTF-8\">",

      "  <title>${1:$CURRENT_DATE}</title>",

      "</head>",

      "<body>",

            " <div class=\"${2|container,wrapper|}\">",

            "   ${3}",

            " </div>",

      "</body>",

      "</html>",

    ],

    "description": "create a html frame"

  }

效果是这样滴

基础结构

  • 片段名字
  • prefix（前缀，输入的触发条件，比如上面例子中当我输入ht后，就能tab出来片段）
  • body（主体部分，在里面根据语法定义自己需要的代码片段）
  • description（说明，片段的具体描述）

基础语法

  • 每个逗号代表一整行的结束，双引号需要用转义字符 \
  • $number表示光标跳转的顺序，比如$1表示光标首次需要跳转的位置，相同序号的会在一起，另外$0表示最终光标位置
  • 变量，在未赋值的情况下提供默认值，这里提供一些变量
    TM_SELECTED_TEXT：当前选定的文本或空字符串；

    TM_CURRENT_LINE：当前行的内容；

    TM_CURRENT_WORD：光标所处单词或空字符串

    TM_LINE_INDEX：行号（从零开始）；

    TM_LINE_NUMBER：行号（从一开始）；

    TM_FILENAME：当前文档的文件名；

    TM_FILENAME_BASE：当前文档的文件名（不含后缀名）；

    TM_DIRECTORY：当前文档所在目录；

    TM_FILEPATH：当前文档的完整文件路径；

    CLIPBOARD：当前剪贴板中内容。

    时间相关

    CURRENT_YEAR: 当前年份；

    CURRENT_YEAR_SHORT: 当前年份的后两位；

    CURRENT_MONTH: 格式化为两位数字的当前月份，如 02；

    CURRENT_MONTH_NAME: 当前月份的全称，如 July；

    CURRENT_MONTH_NAME_SHORT: 当前月份的简称，如 Jul；

    CURRENT_DATE: 当天月份第几天；

    CURRENT_DAY_NAME: 当天周几，如 Monday；

    CURRENT_DAY_NAME_SHORT: 当天周几的简称，如 Mon；

    CURRENT_HOUR: 当前小时（24 小时制）；

    CURRENT_MINUTE: 当前分钟；

    CURRENT_SECOND: 当前秒数。
  • 可选项，当光标到该处的时候弹出一些可选择项，使用 | ，| 后面是自己提供的可选项 我这里是提供了两个值，值之间使用逗号进行分隔

  • body的高级语法，可以参考这里，写的很详细

最后

效果

最后附上把自己的snippet放到market上的教程，使劲戳这里

snippet,让你编码效率翻倍的更多相关文章

  1. Elastic Search 上市了，市值翻倍，这群人财务自由了！

    国庆长假,大部分人还深浸在风花雪月之中,而就在昨天(美国时间10月5号),我们 Java 程序员所熟知的大名鼎鼎的 Elastic Search 居然在美国纽约证券交易所上市了! 当说到搜索时,大部分 ...

  2. VS Code：让你工作效率翻倍的23个插件和23个编辑技巧

    VS Code:让你工作效率翻倍的23个插件和23个编辑技巧 总结了一些平时常用且好用的 VS Code 的插件和编辑技巧分享出来. 文章详情可查阅我的博客:lishaoy.net ,欢迎大家访问. ...

  3. 优步UBER司机奖励政策：含高峰、翻倍、行程、金牌司机、保底奖励(持续更新...)

    滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://didi-uber.com/archiv ...

  4. 北京优步UBER司机B组最新奖励政策、高峰翻倍奖励、行程奖励、金牌司机奖励【每周更新】

    滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...

  5. 大数翻倍法求解CRT

    目录 正文 引入 大数翻倍法 复杂度证明 大数翻倍法的优势 最后的最后:上代码! 注:做法和思路是 zhx 在一次讲课中提出的,如有侵权,请联系作者删除 其实别的题解也有提到过暴力做法,但这里将会给出 ...

  6. 2022必须拥有Chrome扩展程序 - 浏览器插件，让你上网效率翻倍

    在Chrome网上应用店中查找扩展程序 2022必须拥有Chrome扩展程序 - 浏览器插件,让你上网效率翻倍 可扩展的Chrome Web浏览器比某些人认识的功能强大得多.您可以自定义浏览体验,使其 ...

  7. 测试人生 | 薪资翻倍涨至50W是种什么样的体验？

    本文为霍格沃兹测试开发学社优秀学员跳槽笔记,测试开发进阶学习文末加群. 本人已经工作7年了,做的都是功能测试以及写一些简单的自动化脚本,加上之前没有学习的意识,导致专业技术水平与工作年限不匹配,在上家 ...

  8. 仅1年GitHub Star数翻倍，Flink 做了什么？

    Apache Flink 是公认的新一代开源大数据计算引擎,其流水线运行系统既可以执行批处理程序也可以执行流处理程序.目前,Flink 已成为 Apache 基金会和 GitHub 社区最为活跃的项目 ...

  9. PHP 7問世，2億網站效能翻倍有望

    經過10年的漫長等待,PHP 7終於正式問世了.這個影響全球8成網站的開發語言,一舉從5.0版,跳過了功敗垂成的6.0版,一舉進入了7.0時代. 20年前初夏,1995年6月8日,一位愛解決問題的C語 ...

随机推荐

  1. List<T>去重复

    代码 class ListDistinctDemo { static void Main(string[] args) { List<Person> personList = new Li ...

  2. Vue 源码解读（10）—— 编译器 之 生成渲染函数

    前言 这篇文章是 Vue 编译器的最后一部分,前两部分分别是:Vue 源码解读(8)-- 编译器 之 解析.Vue 源码解读(9)-- 编译器 之 优化. 从 HTML 模版字符串开始,解析所有标签以 ...

  3. SQL Server--插入一天数据返回ID值

    这里将该功能写成了一个存储过程, 本来只写Insert的话,返回1,即影响的行数,该数据没太大应用意义. 想在Insert的基础上,返回新添加的这条数据的ID,两种方法: 1 .添加第17行的Sele ...

  4. 第五篇- 抖音的强大对手来了，用Flutter手撸一个抖音国际版，看看有多炫

    前言 由于中间几个月项目天天加班,导致没没时间更新,最近一段时间对前端进行了重构,加了很多页面,如登录.注册.关注.个人中心等,目前写这个纯属业余个人爱好,所以断断续续的继续在做...... 前端地址 ...

  5. VS Code调试C代码

    1.前言 首先说明的是vscode是代码编辑器,并不是编译器,它本身并不能编译C语言. 在这里我们使用的是MinGW-w64作为C语言的编译器.MinGW-w64的前身是MinGW的全称是:Minim ...

  6. laravel 框架 ajax无页面刷新删除

    ....................HTML页面<!doctype html><html lang="en"><head> <meta ...

  7. think php 框架下拉分页

    //以对象的形式获取数据库$data变量的信息,将lastPage()传输至页面 $lastpage = $data->lastPage(); $this->assign('lastpag ...

  8. php 23种设计模型 - 建造者模式

    建造者模式(Builder) 建造者模式(Builder Pattern)使用多个简单的对象一步一步构建成一个复杂的对象.这种类型的设计模式属于创建型模式,它提供了一种创建对象的最佳方式. 一个 Bu ...

  9. kkFileView对接svn服务完成文件在线预览功能

    1.需求: 之前在公司内部搭建了svn服务器,给部门存放文档.视频,做成了一个文档服务器来用,随着视频文件太大,每次下载太慢 需要把文件在线打开查看 2.解决: kkFileView https:// ...

  10. 机器学习之主成分分析（PCA）

    import numpy as np #(1)零均值化def zeroMean(dataMat): meanVal=np.mean(dataMat,axis=0) newData =dataMat - ...