snippet,让你编码效率翻倍

为什么谈到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上的教程,使劲戳 这里

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/367364.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

day12-HTML基础之DOM操作

DOM&#xff08;Document Object Model 文档对象模型&#xff09; 一个web页面的展示&#xff0c;是由html标签组合成的一个页面&#xff0c;dom对象实际就是将html标签转换成了一个文档对象。可以通过dom对象中js提供的方法&#xff0c;找到html的各个标签。通过找到标签就可以…

小程序源码 租房管理系统_如何通过租房小程序开发快速引流

租房市场在整个房产市场占据了极大一部分市场份额&#xff0c;而随着租售同权政策的提出、房价的不断提升&#xff0c;租房市场份额将进一步扩大。合肥小程序开发智速新媒体公司传统的租房方式不管是出租方还是租房客户&#xff0c;彼此之间的消息不对等、沟通困难等因素导致房…

REST 101开发人员专用

本地代码执行 诸如C之类的高级语言中的函数将被汇编为Assembly中的过程 。 它们增加了一个间接级别&#xff0c;使我们不必考虑内存地址。 诸如Java之类的面向对象语言中的方法和多态性增加了另一种间接性 &#xff0c;使我们不必考虑一组相似功能的特定变体。 尽管有这些间…

一个基于Bmob的OPPO锁屏壁纸小程序,写过之后发现...好像没什么卵用...一脸懵逼

小程序之前写的&#xff0c;也就前段时间&#xff0c;毛毛糙糙的写了第一版... 因为使用OPPO手机&#xff0c;所以有个锁屏杂志的东西&#xff0c;里面的图片每天都是由OPPO官方的人进行精选然后推送给用户的&#xff0c;图片菲菲菲菲菲常漂亮&#xff0c;看到网上很多人提取不…

SQLAlchemy 操作数据库

SQLAlchemy 操作数据库 SQLAlchemy为Python提供了不同数据库的统一接口&#xff0c;采用ORM的方式操作数据库&#xff0c;简洁优雅 一、安装 直接通过pip安装即可 pip install sqlalchemy 二、连接数据库 这里用小巧的sqlite来做测试 from sqlalchemy import create_engine# 创…

贝塞尔曲线理解与应用

贝塞尔曲线并非是由贝塞尔发明的&#xff0c;但是是因为他把这个东西应用到当时的汽车领域而闻名的&#xff0c;所以取名为贝塞尔曲线。 在我看来&#xff0c;用简单的话来理解一下贝塞尔曲线&#xff0c;他是通过少量几个点&#xff0c;使用一套公式&#xff0c;生成一条平滑曲…

云服务器布置_【阿里云ECS】(一)云服务器上安装RStudio-server

【阿里云ECS】&#xff08;一&#xff09;云服务器上安装RStudio-server最近注册了阿里云个人版&#xff0c;打算研究研究shiny部署问题。进了阿里云ECS因为是Ubuntu16.04的对于安装R和RStudio还是要学习实践一下的。第一步&#xff0c;安装R语言。我们使用apt的方式进行安装,步…

H5前期知识点总结 9月12日

知识点补充&#xff1a; 属性继承例子&#xff0c;color、font&#xff08;font-size/style/family/weight&#xff09; 1、浏览器的默认字体大小是16px,谷歌浏览器的最小字体是10px,其他浏览器的最小字体是12px。 2、通配符选择器 “*”&#xff0c;即选中body里所有的标签。 …

Spring MVC:Ajax和JQuery

今天&#xff0c;我想演示如何将AJAX集成到Spring MVC应用程序中。 我将在客户端使用JQuery来发送请求和接收响应。 本教程将基于我以前关于Spring MVC和REST服务的教程之一。 在本文中&#xff0c;您将了解如何在异步请求的帮助下使Web应用程序更具交互性。 准备工作 我需要通…

手把手带你写一个JavaScript类型判断小工具

业务写了很多&#xff0c;依然不是前端大神&#xff0c;我相信这是很多‘入坑’前端开发同学的迷茫之处&#xff0c;个人觉得前端职业发展是有路径可寻的&#xff0c;前期写业务是一个积累过程&#xff0c;后期提炼总结&#xff0c;比如编程思想&#xff0c;父子类的原型继承&a…

yolov3之pytorch源码解析_springmvc源码架构解析之view

说在前面前期回顾sharding-jdbc源码解析 更新完毕spring源码解析 更新完毕spring-mvc源码解析 更新完毕spring-tx源码解析 更新完毕spring-boot源码解析 更新完毕rocketmq源码解析 更新完毕dubbbo源码解析 更新完毕netty源码解析 更新完毕spring源码架构更新完毕springmvc源码架…

Xstream将XML转换为javabean的问题

1.问题&#xff1a;Xstream is not security 解决方法&#xff1a;加上 2.问题&#xff1a;如果没有第二行代码&#xff0c;会出现xstream forbiddenclassexception 解决方法&#xff1a;加上第二行&#xff0c;其中参数是要进行解析的对象&#xff01; 调用该方法&#xff1a;…

蚂蚁属性细微差别

每隔一段时间&#xff0c;我会想起Ant属性的一些细微差别 &#xff0c;一旦忘记它们&#xff0c;在与Ant交互时会引起混乱。 特别是&#xff0c; Ant属性 通常是不可变的 &#xff08;不包括Ant 1.8版本的 局部属性 &#xff09;&#xff0c;并且在其首次设置时“永久”设置&am…

《从零构建前后分离的web项目》准备 - 前端了解过关了吗?

前端基础架构和硬核介绍 技术栈的选择 首先我们构建前端架构需要对前端生态圈有一切了解&#xff0c;并且最好带有一定的技术前瞻性&#xff0c;好的技术架构可能日后会方便的扩展&#xff0c;减少重构的次数&#xff0c;即使重构也不需要大动干戈&#xff0c;我通常选型技术栈…

联想w540笔记本参数_2020年12月笔记本电脑推荐!联想、惠普、华为笔记本电脑推荐!18款高性价比笔记本电脑推荐!!!...

前言&#xff1a;笔记本电脑&#xff0c;主要分为三种&#xff1a;轻薄本<全能本<游戏本。轻薄本&#xff0c;又称办公笔记本电脑&#xff0c;因为轻薄方便携带&#xff0c;通常用于移动办公使用。全能本&#xff0c;就是把轻薄本的集显变成了小独显&#xff0c;增加了独…

【BZOJ 1098】办公楼(补图连通块个数,Bfs)

补图连通块个数这大概是一个套路吧&#xff0c;我之前没有见到过&#xff0c;想了好久都没有想出来QaQ 事实上这个做法本身就是一个朴素算法&#xff0c;但进行巧妙的实现&#xff0c;就可以分析出它的上界不会超过 $O(n m)$。 接下来介绍一下这个技巧&#xff1a; 很显然一个…

Spring MVC:资源

我从博客读者那里收到的最常见的问题之一是如何在Spring MVC的应用程序中使用CSS和javascript文件。 因此&#xff0c;这是撰写有关Spring MVC中资源使用情况的文章的好机会。 通常&#xff0c;我将使用基于Java的配置方法。 如今&#xff0c;很难想象没有CSS和JavaScript文件…

c语言读文件空格间隔,c语言文件流实现按单个词读取(以空格、分号等作间隔)...

c语言文件流实现按词读取(以空格、分号等作间隔)1.基本描述在之前的作业中&#xff0c;认真编写代码&#xff0c;从中发现不少知识积累上的欠缺。编程中使用到的c语言文件读取&#xff0c;要求是按照获取到一个完整的词&#xff0c;并对其进行处理。写有java或c语言源程序的.tx…

山东专升本access知识点_全国各省份每年的专升本考试大纲啥时候公布?考纲公布之前你该做什么?...

?星标/置顶专升本招考下一个上岸的就是你最近小编在专升本招考后台收到很多同学的留言&#xff0c;大多同学都是看到好多省都公布了专升本考试政策和大纲&#xff0c;却迟迟不见自己所在的省份出&#xff0c;于是火急火燎地找到小编来问&#xff1a;XX省的考试大纲到底啥时候出…

观点|蚂蚁金服玉伯:我们是如何从前端技术进化到体验科技的?

小蚂蚁说&#xff1a;王保平&#xff0c;花名玉伯。熟悉前端和SeaJS的人一定对这个名字不陌生。作为前端领域的一枚大大大牛&#xff0c;他现在担任蚂蚁金服体验技术部负责人。本文&#xff0c;他分享了他从前端一路进阶升级到体验科技的个人思考&#xff0c;并详细介绍了体验科…