Last Updated: February 25, 2016
·
598
· diegoarcega

Sublime: Start typing then TAB. Create tabTriggers

Speed up your project development with some shortcuts. You can either download a Javascript/PHP/etc set of Snippets(via Package Control: Install Package) or make your own.

Here we are going to create our own tabTrigger.

  • Open Sublime
  • Select Tools > New Snippet
  • Sublime will show you a skeleton, you can modify it to look like this: Picture
  • Save at : Packages/User folder location as a .sublime-snippet file format(ex: consoledebug.sublime-snippet)

Whatever is inside <![CDATA[ ]]> is going to be printed out when you write your tabTrigger in your scope and hit tab.

The ${1:this} notation will make the cursor focus on this word right after the action is performed, this could be any other word like: clientVariable, peopleObject or cityArray.

<snippet>
    <!-- Result to be printed ex: console.debug(''); -->
    <content><![CDATA[console.debug(${1:this});]]></content>
    <!-- Optional: Tab trigger to activate the snippet -->
    <tabTrigger>debug</tabTrigger>
       <!-- Optional: Scope the tab trigger will be active in -->
    <scope>source.js</scope>
    <!-- Optional: Description to show in the menu -->
     <description>console.debug('');</description>
</snippet>

You can only have one tabTrigger per file, so, for each new tabTrigger you are going to create, you need another .sublime-snippet file.

More:
http://sublimetext.info/docs/en/extensibility/snippets.html

1 Response
Add your response

Cool. This is a good tutorial.
Congrats.

over 1 year ago ·