sublimetextのスニペットのメモ

sublimetext_snippet.md

sublimetextのスニペット

http://docs.sublimetext.info/en/latest/reference/snippets.html

書式

<snippet>
    <content><![CDATA[]]></content>
    <tabTrigger></tabTrigger>
    <scope></scope>
    <description></description>
</snippet>

content:

呼び出されるテキスト。必須。

<![CDATA[
{ここに呼び出したいコードを書く}
]]>

tabTrigger

トリガーとなるキー。未指定の場合はtab入力はできずコマンドパレットから選択する

<tabTrigger>hoge</tabTrigger>

hogeを入力した状態でtabを入力するとhogeを置き換える形でスニペットが展開される

scope

対象となるスコープ。未指定の場合は対象を制限しない。

scopeに指定できるscope nameは、
何かファイルを開いた状態でshow_scope_name（⌘+option+p）でステータスバーに表示される。
htmlならtext.html.basic
markdownならtext.html.markdownなど。

スコープの詳細

description

コマンドパレットに表示されるテキスト。未指定の場合はファイル名が表示される

実行

/Library/Application Support/Sublime Text 3/Packages/User/{ファイル名}.sublime-snippet
とかで保存

デフォルトではキーを入力してtabで展開されるが、tabがEmmetなど他のパッケージで取られていたり設定を変えてると効かない。
その場合はキーバインドを変更するか、後述のキーバインドで直接指定するか、コマンドパレットから選択する

contentで指定できる書式

キャレット位置指定

$1,$2...$n

tabキーを押すたびに$1、$2で指定した編集点にキャレットが移動する。 $0で最後の編集点に移動。

例

content:<img src="$1" alt="$2">$0
key:img

| :キャレット

img|
↓ tab
<img src="|" alt="">
↓ tab
<img src="" alt="|">
↓ tab
<img src="" alt="">|

プレースホルダー

{$1:hoge}..{$n:fuga}

編集点にプレースホルダーテキストを表示する。
プレースホルダーテキストはtabで移動すると範囲が指定された状態になる

例

content:<img src="${1:パス}" alt="${2:代替}">$0
key:img

| :キャレット
[] :範囲指定

img|
↓ tab
<img src="[パス]|" alt="代替">
↓ tab
<img src="パス" alt="[代替]|">
↓ tag
<img src="パス" alt="代替">|

選択範囲のテキストを利用

$SELECTION

選択範囲のテキストを展開後に利用する

例:

content:<p>$SELECTION</p>
key:p

| :キャレット
[] :範囲指定

phoge
p|[hoge]
↓
<p>hoge</p>

正規表現を使った置換

/対象/結果/オプション

オプション
未指定 : 最初の1件だけ置換
g : 全件置換
i : 大文字/小文字を区別しない

例

content:${SELECTION/<br?{ /}>/\n/gi}
key:text

| :キャレット
[] :範囲指定

texthoge<BR>fuga<br>moge<br>foo<BR>bar
text|[hoge<BR>fuga<br>moge<br>foo<BR>bar]
↓

hoge  
fuga  
moge  
foo  
bar  

キーバインドでスニペットファイルを設定

{
    "keys": ["ctrl+shift+w"],
    "command": "insert_snippet",
    "args": { "name": "Packages/User/hoge.sublime-snippet" }
}, 

タグトリガーを無視して実行される

キーバインドでスニペットを直接定義

$0で実行後のキャレット位置

{
    "keys": ["ctrl+shift+w"],
    "command": "insert_snippet",
    "args": {"contents": "<p>$0</p>"}
},  

${0:hoge}でプレースホルダー

{
    "keys": ["ctrl+shift+w"],
    "command": "insert_snippet",
    "args": {"contents": "<p>${0:hoge}</p>"}
},

$SELECTIONで選択範囲のテキストを利用

{
    "keys": ["ctrl+shift+w"],
    "command": "insert_snippet",
    "args": {"contents": "<p>$SELECTION</p>"}
},

${SELECTION/対象/結果/オプション}で選択範囲のテキストを正規表現で置換

{
    "keys": ["ctrl+shift+w"],
    "command": "insert_snippet",
    "args": {"contents": "${SELECTION/<br( \\/)?>/\\n/gi}"} 
},

エスケープはスニペットでは\だが、キーバインドでは\\