利用sublime的snippet功能快速创建代码段
在前端开发中我们经常会输入相同的一些基本代码,例如常用的jquery引用,bootstrap框架,cssreset等等,如果每次使用时在复制粘贴感觉很麻烦,这里介绍一种更为简洁的方法
利用sublime的snippet功能快速创建代码段
打开Tools->New snippet我们能看到如图所示内容

要是没有一点英语基础,就有点抓瞎了,今天就来介绍一下如何使用这超级功能
首先简要介绍一下snippet的组成部分:
content:其中必须包含<![CDATA[…]]>,否则无法工作, 里面包含自己要使用的代码段,这里页面上所示的代码段是Hello, this is a snippet. ${1:this}表示获得代码段后光标首先放在this后面, ${2:snippet}表示按下Tab键后光标将从this跳到snippet后面,这些都是为了方便输入后续代码。如果你要贴入的代码段是不需要修改的,则可忽略这些tabTrigger:用来引发代码片段的字符或者字符串, 比如在以上例子上, 在编辑窗口输入hello然后按下tab就会在编辑器输出Hello, this is a snippet. 这段代码片段scope: 表示你的代码片段会在那种语言环境下激活, 比如上面代码定义了source.python, 意思是这段代码片段会在python语言环境下激活.
好了,接下来展示我自己经常使用的代码段

如此设置之后,在html页面中输入jquery再按下Tab键,即可快速得到你在snippet中的代码段,即
<script src="http://apps.bdimg.com/libs/jquery/1.9.0/jquery.min.js"></script>
怎么样,够快的吧!再也不用敲那么多代码了。
css也可如此使用

这是我的pc端cssreset代码段,这样我只要在css页面中输入cssresetpc,再按下Tab键即可得到cssreset。
简直快的不能再快了,你看明白了吗?
利用sublime的snippet功能快速创建代码段的更多相关文章
- 利用 Create React Native App 快速创建 React Native 应用
本文介绍的 Create-React-Native-App 是非常 Awesome 的工具,而其背后的 Expo 整个平台也让笔者感觉非常的不错.笔者目前公司是采用 APICloud 进行移动应用开发 ...
- 【转】在Visual Studio中怎样快速添加代码段
原文网址:http://blog.csdn.net/yl2isoft/article/details/9735527 以前一直只知道,键入prop,再按两次tab键,会生成自动属性代码. 今天闲着无事 ...
- 在visual studio中快速添加代码段
昨天我在网课上,看到老师输入#2之后,立马就出现了一堆代码. 我于是赶紧打开自己的visual studio尝试一下,并没有任何反应. 上网查找,发现visual studio有自定义代码段的功能. ...
- VS Code 创建代码段 Snippets
菜单:文件 -> 首选项 -> 用户代码片断 打开User Snippets菜单: 选择C#: 然后把里面注释的文字留下, 复制其中那段代码并修改称自己的代码段: "Create ...
- Visual Studio Code 添加设置代码段(snippet)
从VSCode发布以来就在关注,最近已经更新到版本0.10.8,已经支持了插件功能.日常使用编辑器已经由Sublime Text迁移到了VSCode.使用中遇到了这个问题,在网上也没搜到解决方案.记录 ...
- Visual Studio常用小技巧一:代码段+快捷键+插件=效率
用了visual studio 5年多,也该给自己做下备忘录了.每次进新的组换新的电脑,安装自己熟悉的环境又得重新配置,不做些备忘老会忘记一些东西.工具用的好,效率自然翻倍. 1,代码段 在Visua ...
- VS.net中快捷键收缩和展开代码段
i. Ctrl-M-O 折叠所有方法 ii. Ctrl-M-P 展开所有方法并停止大纲显示(不可以再折叠了) iii. Ctrl-M-M 折叠或展开当前方法 iv. Ctrl-M-L展开所 ...
- (视频) 《快速创建网站》 2.3 WordPress初始化和功能简介
本文是<快速创建网站>系列的第4篇,如果你还没有看过之前的内容,建议你点击以下目录中的章节先阅读其他内容再回到本文. 访问本系列目录,请点击:http://devopshub.cn/tag ...
- (视频) 《快速创建网站》 3.2 WordPress多站点及Azure在线代码编辑器 - 扔掉你的ftp工具吧,修改代码全部云端搞定
本文是<快速创建网站>系列的第6篇,如果你还没有看过之前的内容,建议你点击以下目录中的章节先阅读其他内容再回到本文. 访问本系列目录,请点击:http://devopshub.cn/tag ...
随机推荐
- DevExpress 关于 GridView 表格编辑中 点击其他按钮里导致 值未取到处理
只需要给添加以下代码 在执行其他按钮前调 用一下 就可以了:主要是用来关闭编辑以及更新当前行编辑内容 this.gridControl1.FocusedView.CloseEditor(); this ...
- C# 平时碰见的问题【4】
1. 模糊查询 like的参数化写法 string keyword="value"; // 要模糊匹配的值 错误示范: sql: string strSql=" ...
- 导购效果跟踪: SPM
什么是SPM SPM是淘宝社区电商业务(xTao)为外部合作伙伴(外站)提供的一套跟踪引导成交效果数据的解决方案. 下面是一个跟踪点击到宝贝详情页的引导成交效果数据的SPM示例: http://det ...
- python学习第二天第一部分
备注:写程序不能写重复性的代码 学习内容:数据类型.for循环.while循环.字符编码.文件处理 一.for循环 1.简单的for循环 for i in range(10): # 此处意思为:循环r ...
- Python核心编程--学习笔记--9--文件和输入输出
本章将深入介绍Python的文件处理和相关输入输出能力,包括:文件对象(以及它的内建函数.内建方法和属性),标准文件,文件系统的访问方法,文件执行,最后简要涉及持久存储和标准库中与文件有关的模块. 1 ...
- this的使用方法
当一个对象创建后,Java虚拟机(JVM)就会给这个对象分配一个引用自身的指针,这个指针的名字就是this.this是指向对象本身的一个指针.this只和特定的对象关联,而不和类关联,同一个类的不同对 ...
- Android--获取短信的内容,截取短信
1.首先我们要写一个广播接收器,当我们的手机收到短信时,系统会自动发送一个广播,我们只需要接收到这条广播就可以了 2.在广播里面,我们重写的onReceive()方法,通过里面的Intent写到的Bu ...
- poj 2887 Big String
题目连接 http://poj.org/problem?id=2887 Big String Description You are given a string and supposed to do ...
- 获取 UIWebView中用户所点击的图片URL
在使用 UIWebView 的时候 (通常是阅读类的 App),会有点击图片放大的需求,那么可以通过设置 UIWebViewDelegate 来过滤请求,取出图片的 URL 这个方法的前提是 img ...
- ExtJS MVC 学习手记3
在演示应用中,我们已经创建好了viewport,并为之添加了一个菜单树.但也仅仅是这样,点击树或应用的其他地方获得不到任何响应.这个演示应用还是一个死的应用. 接下来,我们让这个应用活起来. 首先,给 ...