Начав использовать Sublime Text 2, я понял, что хочу немного упростить себе жизнь, создав несколько полезных сниппетов, но столкнулся с тем, что на тот момент в сети не было инструкции на русском языке. Найдя неплохую англоязычную статью я решился на перевод, попутно немного дополнил и узнал пару несколько интересных нюансов, которыми готов поделиться с вами.
О неточностях, опечатках, ошибках пишите в личку — буду оперативно исправлять.
Сниппет
Это шаблон сниппета в Sublime Text 2. Добраться до него можно через 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>
Непосредственно код для вставки содержится между <![CDATA[ какой-то код ]]>. А вот реальный пример:
.
- <snippet>
- <content><![CDATA[
- assert_equal(${1:expected}, ${0:actual})
- ]]></content>
- <tabTrigger>ase</tabTrigger>
- <scope>source.ruby</scope>
- <description>assert_equal(..)</description>
- </snippet>
Теперь, когда вы вбиваете в редактор «ase» и затем нажимаете Tab «ase» заменяется на заданный в сниппете код.
- assert_equal( expected, actual )
Теперь мы понимаем, что ${1:expected} означает, что слово “expected” будет подсвечено первым после нажатия Tab, готовое к редактированию, а если нажать Tab еще раз, то курсор перейдет на ${0:actual}, т.е. подсвечено будет слово “actual”.
Довольно странно, что ${0:actual} подсвечивается вторым. Вы могли подумать, что по нажатию Tab после ввода «ase» подсвечено будет ${0:actual} т.к. 0 идет перед 1, но не тут то было — ${0} всегда будет выделено последним, куда бы вы его не впихнули. Так что если у вас сниппет наподобие этого:
- <snippet>
- <content><![CDATA[
- Hello, ${1} is a ${2:snippet}. ${0}, ${3}
- ]]></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>
Каждый раз по нажатию Tab вас будет перебрасывать на ${1} затем на ${2} затем на ${3} и наконец ${0}.
Так же обратите внимание, что достигнув ${0}, выделение перестанет перемещаться. Можно догадаться, что ${0} обозначает тот участок кода, после которого пользователь обычно сразу начинает писать дальше.
Надоело жать на Tab
Вам могло показаться, что забиндить таким образом можно только кнопку Tab. А что если вы хотите использовать ctrl-alt-. чтобы создавать подобные обертки: <%= %>?
Чтобы этого добиться вы должны привязать клавиатурное сочетание к сниппету:
идем в Preferences, затем Key Bindings – User. Вот как это должно выглядеть:
- [
- {
- «keys»: [«command+shift+.»],
- «command»: «insert_snippet»,
- «args»: {«name»: «Packages/User/erb.sublime-snippet»}
- }
- ]
Итак, тут есть несколько опций:
“keys”: желаемое сочетания клавиш
“command”: название команды
“args”: дополнительные аргументы
Не забываем, что в конце концов нам нужно создать сниппет :) Чтобы найти где лежат все «packages» кликните на пункт меню Preferences, затем Browse Packages. Отыщите папку User и добавьте erb.sublime-snippet со следующим содержимым:
- <snippet>
- <content><![CDATA[<%= ${1} %>]]></content>
- </snippet>
Готово!
Дополнение от zimorodok
1. Можно использовать переменные, например $TM_SELECTED_TEXT. Удобно для указания значения по умолчанию, когда для сниппета указана горячая клавиша или сниппет запускается из панели команд.
<snippet>
<content><![CDATA[console.log(${0:$TM_SELECTED_TEXT});]]></content>
<tabTrigger>cl</tabTrigger>
<scope>source.js</scope>
<description>console.log</description>
</snippet>
2. Можно использовать регулярные выражения, чтобы модифицировать тело сниппета в процессе набора.
<snippet>
<content><![CDATA[set${5:T}${5/(T)|(I).*/(?1:imeout)(?2:nterval)/}(${20:function () \{${0:$TM_SELECTED_TEXT}\}}, ${10:50});]]></content>
<tabTrigger>set</tabTrigger>
<scope>source.js</scope>
<description>setTimeout, setInterval</description>
</snippet>
При наборе «set» — TAB можно продолжить писать «I», и автоматом подставится «terval». На словах сложно описать, но это удобно.
Набор сниппетов для javascript от zimorodok
Ссылки:
www.sublimetext.com/download — Download
www.sublimetext.com/docs/api-reference — Plugin API Reference
habrahabr.ru/post/136529 — Отличная статья о создании плагинов для Sublime Text 2
github.com/bobthecow/sublime-sane-snippets — Sane Snippet — плагин для создания сниппетов (спасибо TycoooN)
sublimetext.info — Неофициальная документация
sublimetext.info/docs/en/reference/snippets.html — Глава про сниппеты