55
54

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Sublime Text 2にSnippetを登録する

Last updated at Posted at 2013-08-06

Sublime Text 2にカスタムSnippetを登録すると、作業中にSnippetを一発呼び出しできるようになり、楽しさが倍になる。
応用範囲は広そうだけど、自分はひとまずテンプレート呼び出し用に使っている。
登録にちょっとだけコツが要る。

#登録方法

1.1 Tools - New Snippetを実行。Snippetファイルが新規作成される。
スクリーンショット 2013-08-06 14.09.04.png

1.2 contentタグの CDATA[ と ]]>の間にあるサンプルコードを削除し、登録したいテンプレートを貼り付ける。CDATA内では改行も含めてそのまま扱われるので、余分な改行を残したりしないこと。

スクリーンショット 2013-08-06 14.10.30.png

貼りつけたところ。
スクリーンショット 2013-08-06 14.12.11.png

1.3 tabTriggerタグのコメントを外し、使用したいトリガーを登録する。ここではclearlineとした。なおコメントは⌘ + / で一発で外せる。

スクリーンショット 2013-08-06 14.14.37.png

1.4 scopeタグのコメントを外し、スコープを指定する。text.htmlと書けば、このSnippetはhtmlファイルでしか呼び出されなくなる。なお、cssの場合はsource.cssと書くのが正しいらしい。
スクリーンショット 2013-08-06 14.17.00.png

1.5 ⌘ - S でSnippetを保存する。保存場所は以下に固定されている。

ここで注意。ファイル名は必ず「.sublime-snippet」で終わること。それ以外の部分は何でもよい。

1.6 保存が終わったらSnippetを閉じてよい。Sublime Text 2の再起動は不要。

#使用方法

2.1 scopeが一致するファイル (ここではhtml] 上で、登録したトリガーを入力し、tabキーを押す。
スクリーンショット 2013-08-06 14.24.47.png

2.2 瞬時にSnippetが呼び出される。病み付きになる。
スクリーンショット 2013-08-06 14.25.29.png

2.3 トリガーを忘れても大丈夫。おなじみの ⌘ + Shift + P でこのSnippetを呼び出すこともできる。キーコンビネーションもここで確認できる。
スクリーンショット 2013-08-06 14.29.37.png

*余談: Qiitaでは記事中にCDATAタグをそのまま書くとそこから先が欠落してしまうことが判明。

55
54
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
55
54

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?