我们在编写代码的时候，总会遇到一些需要反复使用的代码片段。这时候就需要反复的复制和黏贴，大大影响效率。我们利用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> -->

    <!-- <description>description</description> -->

</snippet>

其中，content中由CDATA包裹起来的部分是我们要插入的代码片段，可选。

tabTrigger是我们tab键触发的自动补全代码功能的一个名字，可选。

scope，可选，使用范围，不填写代表对所有文件有效。附：source.css和test.html分别对应不同文件。

description，可选，在snippet菜单中的显示说明（支持中文）。如果不定义，菜单则显示当前文件的文件名。

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

现在，你应该有了个大致的了解。那我们就开始自己动手编写一个实例。我们都知道，再Sublime中，输入！或者html:5再按tab键，可以自动补全HTML结构，但是这个结果相对很简单，我自己扩展了它的结果内容，新增了几个mate标签，增加了页面描述。

<snippet>

    <content><![CDATA[

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

    <meta name="Generator" content="Sublime Text3">

    <meta name="Author" content="dunizb">

    <meta name="website" content="http://www.mybry.com">

    <meta name="Description" content="读你，这世间唯有梦想和好姑娘不可辜负~~">

    <link type="image/x-icon" rel="shortcut icon" href="image/favicon.ico" />

    <script type="text/javascript">

        ${1:}

    </script>

<body>

    ${2:这是html内容}

</body>

</html>

]]></content>

    <!-- Optional: Set a tabTrigger to define how to trigger the snippet -->

    <tabTrigger>hjs</tabTrigger>

    <!-- Optional: Set a scope to limit where the snippet will trigger -->

    <!-- <scope>source.python</scope> -->

    <description>custom-html</description>

</snippet>

然后保存代码片段，保存到Sublime Text3\Data\Packages\User下面，取个名字

Paste_Image.png

就这样，在HTML页面中输入hjs+tab，就可以自动补全这一系列代码了

文／dunizb（简书作者）
原文链接：http://www.jianshu.com/p/c828dea65e07
著作权归作者所有，转载请联系作者获得授权，并标注“简书作者”。
文章首发于《读你》博客http://www.mybry.com，转载请注明出处

如何在Sublime Text中添加代码片段的更多相关文章

  1. sublime text 3 添加代码片段

    工具>插件开发>新建代码片段 <snippet> <content> <![CDATA[ Hello, ${1:this} is a ${2:snippet} ...

  2. 如何在Sublime text中运行PHP文件

    如何在Sublime text中运行PHP文件 2014-06-14 17:17 3709人阅读 评论(1) 收藏 举报 phpSublime Text 一.将PHP安装目录放如环境变量PATH 二. ...

  3. 如何在VScode中添加代码片段

    拿 VUE 举例,新建 VUE 文件,输入前缀,出现代码段 文件 --->  首选项 ---> 用户代码片段  在输入框中输入 vue ,找到 vue.json ,然后在 vue.json ...

  4. Sublime Text自定制代码片段(Code Snippets)

    在编写代码的整个过程中,开发人员经常会一次又一次的改写或者重用相同的代码段,消除这种重复过程的方法之一是把我们经常用到的代码保存成代码片段(snippets),这使得我们可以方便的检索和使用它们. 为 ...

  5. 在sublime text中添加JavaScript的build-system

    -step 1: 下载安装node.js, 并添加到path变量中. -step 2: 在sublime text中新建一个build-system. tools --> build-syste ...

  6. Sublime Text Snippets（代码片段）功能

    原文链接:http://www.bluesdream.com/blog/sublime-text-snippets-function.html 我们在编写代码的时候,总会遇到一些需要反复使用的代码片段 ...

  7. sublime text 2自定义代码片段

    本文引用   http://www.blogjava.net/Hafeyang/archive/2012/08/17/how_to_create_code_snippet_in_subline_tex ...

  8. 如何在 sublime text 中以当前文件目录打开 cmd

    需求描述 sublime 固定可以自己设置和添加新的编译环境,比如在我们写 js 的时候可能会添加 node 来对 js 文件进行运行.但是,这样做的结果是,我们只能看到运行结果.有时候还希望能做些其 ...

  9. Sublime Text 中使用Git插件连接GitHub

    sublime Text的另一个强大之处在于它提供了非常丰富的插件,可以帮助程序员来适合大多数语言的开发.这些插件通过它自己的Package Controll(包管理)组件来安装,非常方便.一般常用的 ...

随机推荐

  1. maven pom.xml详细介绍，必须留一份

    <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/20 ...

  2. swift设置textfield边框颜色

    //swift3.0,如果是2.0的话也可以照着这个样子去写,语法有所变动.根据联想出来的就可以了. let tx = UITextField(frame: CGRect(x: 100, y: 100 ...

  3. ELK采集之nginx 之高德地图出城市IP分布图

    1.采用拓扑: 角色扮演: Agent:采用logstash,IP:192.168.10.7 Redis队列: IP:192.168.10.100 Indexer:logstash,IP:192.16 ...

  4. asp.net小技巧：保留password模式文本框textbox内的数据不丢失。

    在asp.net 2.0环境下,使用textbox,提交到服务器再传回,如果textbox是password模式的,那么textbox内的密码(星号.圆点),就没有了! 一个可行的做法是 : prot ...

  5. git 基本用法

    p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 18.0px "Helvetica Neue"; color: #454545 } p. ...

  6. C语言：json库使用学习

    Json基础 一.Json的概念 Json(Javascript Object Notation)全称为JavaScript对象表示法,是一种轻量级的数据交换格式,采用完全独立于语言的文本格式.JSO ...

  7. Amdahl's Law

    Amdahl's Law 程序可能的加速比取决于可以被并行化的部分. 如果没有可以被并行化的部分,则P=0,speedup=1,no speedup. 如果全部可以被并行化,P=1,speedup i ...

  8. CoreJavaE10V1P3.9 第3章 Java的基本编程结构－3.9 大数值（Big Numbers）

    如果基本的整型与浮点型不能满足需求,可以使用java.Math包提供的 BigInteger 和 BigDecimal 两个类,这两个类可以存储任意长度的数, BigInteger 实现的任意精度整数 ...

  9. mysql循环插入数据库中数据。

    DELIMITER ;; CREATE PROCEDURE test_insert () BEGIN DECLARE i INT DEFAULT 1; WHILE i<100 DO insert ...

  10. iOS GCD基础篇 - 同步、异步，并发、并行的理解

    1.关于GCD - GCD全称是Grand Central Dispatch  - GCD是苹果公司为多核的并行运算提出的解决方案  - GCD会自动利用更多的CPU内核(比如双核.四核)  - GC ...