标签：目录 fine efi ges rip next tool log classname
我们在编写代码的时候，总会遇到一些需要反复使用的代码片段。这时候就需要反复的复制和黏贴，大大影响效率。我们利用Sublime Text的snippet功能，就能很好的解决这一问题。通俗的讲，就是把我们常用的代码分别保存起来，然后通过插件的形式来反复调用。
创建方法：Tools > Developer > New Snippet。
这是你会看到如下示例代码：
1 <snippet> 2 <content><![CDATA[ 3 Hello, ${1:this} is a ${2:snippet}. 4 ]]></content> 5 <!-- Optional: Set a tabTrigger to define how to trigger the snippet --> 6 <!-- <tabTrigger>hello</tabTrigger> --> 7 <!-- Optional: Set a scope to limit where the snippet will trigger --> 8 <!-- <scope>source.python</scope> --> 9 </snippet>
如果你有一些困惑，请看下面的解释：
1 <snippet> 2 <content><![CDATA[ 3 你需要插入的代码片段${1:name} 4 ]]></content> 5 <!-- 可选：快捷键，利用Tab自动补全代码的功能 --> 6 <tabTrigger>reactclass</tabTrigger> 7 <!-- 可选：使用范围，不填写代表对所有文件有效。附：source.css和test.html分别对应不同文件。 --> 8 <scope>source.js</scope> 9 <!-- 可选：在snippet菜单中的显示说明（支持中文）。如果不定义，菜单则显示当前文件的文件名。 --> 10 <description>My Snippet</description> 11 </snippet>
${1:name}表示代码插入后，光标所停留的位置，可同时插入多个。其中:name为自定义参数（可选）。
${2}表示代码插入后，按Tab键，光标会根据顺序跳转到相应的位置（以此类推）。
下面是我的一个示例：
1 <snippet> 2 <content> 3 <![CDATA[ 4 import React, {Component} from ‘react‘; 5 6 class ${1:ClassName} extends Component { 7 8 constructor(props) { 9 super(props); 10 } 11 12 componentWillMount() { 13 14 } 15 16 componentDidMount() { 17 18 } 19 20 componentWillReceiveProps(nextProps) { 21 22 } 23 24 render() { 25 return ( 26 27 ); 28 } 29 } 30 31 export default ${2:ClassName}]]> 32 </content> 33 <!-- Optional: Set a tabTrigger to define how to trigger the snippet --> 34 <tabTrigger>reactclass</tabTrigger> 35 <!-- Optional: Set a scope to limit where the snippet will trigger --> 36 <scope>source.js</scope> 37 </snippet>
创建完毕以后，保存在Sublime Text\Packages\User目录下，文件命名随意，后缀名.sublime-snippet。
这个时候，在js文件中就可以通过reactclass快捷键直接创建ES6语法对应的React Class了，开发效率大大提高了。
标签：目录 fine efi ges rip next tool log classname
原文地址：http://www.cnblogs.com/diesel/p/6784692.html
