原文链接:http://www.bluesdream.com/blog/sublime-text-snippets-function.html

我们在编写代码的时候,总会遇到一些需要反复使用的代码片段。这时候就需要反复的复制和黏贴,大大影响效率。我们利用Sublime Text的snippet功能,就能很好的解决这一问题。通俗的讲,就是把我们常用的代码分别保存起啦,然后通过插件的形式来反复调用。

创建方法:Tools > New Snippet

这时你会看到如下示例代码:

<snippet>
     <content><![CDATA[
Hello, ${1:this} is a ${2:snippet}.
]]></content>
     <!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
     <!-- <tabTrigger>hello</tabTrigger> -->
     <!-- Optional: Set a scope to limit where the snippet will trigger -->
     <!-- <scope>source.python</scope> -->
</snippet>

此时的你应该有点莫名,我们接着来看下完整的结构和说明:

<snippet>
    <content><![CDATA[ 你需要插入的代码片段${1:name} ]]></content>
    <!-- 可选:快捷键,利用Tab自动补全代码的功能 -->
    <tabTrigger>xyzzy</tabTrigger>
    <!-- 可选:使用范围,不填写代表对所有文件有效。附:source.css和test.html分别对应不同文件。 -->
    <scope>source.python</scope>
    <!-- 可选:在snippet菜单中的显示说明(支持中文)。如果不定义,菜单则显示当前文件的文件名。 -->
    <description>My Fancy Snippet</description>
</snippet>

${1:name}表示代码插入后,光标所停留的位置,可同时插入多个。其中:name为自定义参数(可选)。
${2}表示代码插入后,按Tab键,光标会根据顺序跳转到相应位置(以此类推)。

现在,你应该有了个大致的了解。那我们就开始自己动手编写一个实例:

<snippet>
     <content>
     <![CDATA[
     <footer>
          <p>Copyright © 2008-2012 ${1:bluesdream}.com</p>
          <p>增值电信业务经营许可证 沪B2-${2} <a href="#">沪ICP备号${3}</a></p>
     </footer>
     ]]>
     </content>
     <tabTrigger>cft</tabTrigger>
     <description>custom-footer</description>
     <scope>text.html</scope>
</snippet>

创建完毕以后,保存在\Packages\User目录下(例 X:\Sublime Text 2.0\Data\Packages\User),文件命名为cft-code,后缀名.sublime-snippet。

此时我们打开一个html文件,输入cft,再按Tab键,刚才我们所编写的代码段,就插入了进来。并且此时的光标停留在我们所标记的${1}位置
处,如果我们再按下Tab,那么光标就跳转到${2}的位置。由于我们在scope中定义了仅在html文件中使用,所以此时如果我们打开的是css或其
他格式的文件,那将无法插入代码段。

补充:除了利用快捷键Tab出代码之外,我们还能通过菜单来加载,打开Tools > Snippet,选择Snippet:
custom-footer。如果你没有定义description,那此时便会看到以我们文件名为命名的Snippet: cft-code选项。

Sublime Text Snippets(代码片段)功能的更多相关文章

  1. sublime text 2代码片段(Snippet)功能的使用

    “snippet”在英语里面是“片段”的意思.当我们编码时候,通常想要打几个简略的字符串,就出来一些固定的模板. 例如:使用snippet在新建文件时快速生成HTML头部信息等. 定义很简单,菜单:t ...

  2. Sublime Text 新建代码片段(图解)

    新建代码片段 1.打开NEW Snippet- 2.编辑代码片段 3.设置快捷键,按tab键执行 更多内容请见原文,原文转载自:https://blog.csdn.net/weixin_4451949 ...

  3. sublime自定义snippet代码片段

    相信很多人喜欢sublime编辑工具有两个原因:第一sublime很轻巧方便:第二sublime提供很多自定义拓展功能,包括很简单且和很好用的代码片段功能snippet文件. 今天,在这里就介绍下su ...

  4. Code Snippets 代码片段

    Code Snippets 代码片段       1.Title : 代码片段的标题 2.Summary : 代码片段的描述文字 3.Platform : 可以使用代码片段的平台,有IOS/OS X/ ...

  5. ATOM & Sublime Text 下MarkDown插件功能比较

    ATOM & Sublime Text 下MarkDown插件功能比较 作者:net66 更新日期:2016-6-14 10:50 [一] 编辑器 Sublime Text3 vs Atom ...

  6. Sublime Text 3最好的功能、插件和设置(转)

    Sublime Text 3 是一个了不起的软件.首先,它是一个干净,实用,可以快速的编写代码编辑器.它不仅具有令人难以置信的内置功能(多行编辑和VIM模式),而且还支持插件,代码片段和其他许多东西. ...

  7. Sublime Text 2 代码片断

    原文:Snippets 不管是在编码,还是写畅销书,你都可能会需要一遍又一遍的用到一些文本的小片断.使用片断来结束这种单调无聊的码字吧,片断是一种智能的模板,它能在合适的上下文中插入你需要的文本内容. ...

  8. sublime text3 增加代码片段(snipper)

    有时候编写代码时有些代码片段经常会用到,如果能将这些代码片段整理,再在需要的时候通过某些条件触发,那无疑是非常方便的! 创建方法:工具->插件开发->新建代码片段 默认产生的内容是: &l ...

  9. 神器-Sublime Text 3 代码编辑器安装与使用

    一.软件获取 1.软件下载地址:http://www.sublimetext.com/3. 2.注册机和汉化下载:http://files.cnblogs.com/files/1312mn/subli ...

随机推荐

  1. 6. spring启动类配置问题

    1. @SpringBootApplication(scanBasePackages={"com.example.*"}) 相当与 @SpringBootApplication @ ...

  2. 【手记】MTK之TASK创建及使用

    首先来看看task的数据类型声明,在config\include\hal\task_config.h中对task和module类型进行了定义. /*************************** ...

  3. 转 JVM找出占用CPU最高的线程

    这两天客户这边有一台服务器一到下午3点左右就开始卡住,页面无法访问,服务器CPU占用达到300%多开始以为只是可能只是意外事件,重启一下就好,但是发现重启之后没几分钟服务器马上又反应无法访问,我就开始 ...

  4. vue-cli使用vux时报错处理,“You may need an appropriate loader to handle this file type”

    先说解决方案: 在项目中找到build,找到webpack.base.conf.js 将vux给出的解决方案代码拷贝出来 const vuxLoader = require('vux-loader') ...

  5. 【C++】C++中的string类的用法总结

    相信使用过MFC编程的朋友对CString这个类的印象应该非常深刻吧?的确,MFC中的CString类使用起来真的非常的方便好用.但是如果离开了MFC框架,还有没有这样使用起来非常方便的类呢?答案是肯 ...

  6. 关于ASP.NET 服务器报错 Server Error in '/' Application Runtime Error 错误及解决方法

    今天遇到一个错误 程序在服务器上运行时报错 先贴上错误代码 自己也在网上找了一些解决方法,把错误定位到服务器的配置文件也就是Web.config的问题, 于是在system.web节点下 加上cust ...

  7. thinkphp 5 _initialize 使用问题

    如果继承的是common的话.控制器的_initialize要先继承父类的_initialize parent::_initialize();

  8. 解题(DirGraCheckPath--有向图的遍历(深度搜索))

    题目描述 对于一个有向图,请实现一个算法,找出两点之间是否存在一条路径. 给定图中的两个结点的指针DirectedGraphNode* a, DirectedGraphNode* b(请不要在意数据类 ...

  9. 链接错误:multiple definition of 'xxx' 问题解决及其原理

    内容借鉴 于CSDN炸鸡叔 错因 截图: “multiple definition of  'head' ” “multiple definition of  'tail' ” 解决过程: 1.首先要 ...

  10. CodeWarrior 10 添加/修改 头文件路径

    当使用CodeWarrior 10时,默认使用大名鼎鼎的GCC编译器. 我们在构建工程的时候,往往按模块分类文件夹,那么就存在需要包含头文件路径的问题.那么如何加入头文件的路径呢?见下文. 1.打开工 ...