プロジェクションマッピング

エンターテインメントから工業利用まで、プロジェクションマッピングの活用・運用をお考えの方へ

more

インタラクティブ&サイネージ

情報表示用のデジタルサイネージから、センサーを利用したインタラクティブ要素などをお考えの方へ

more

VR/360MOVIE

VRHMD用コンテンツからプラットフォームを利用した360度ムービーを活用したPRをお考えの方へ

more
CONTACT 052-253-9866

Sublime Text2の補完出来ないコードをスニペットで追加してみる!

2014.09.13 土曜日 15:31:41

NKJ56_poisonbottle_02

Sublime Text2は、豊富なプラグインが魅力のひとつである、人気のテキストエディタです。
プラグインを追加することによって、様々な言語の補完機能を追加することができ、
コーディングのスピードをアップしてくれます。

しかし、補完プラグインでも上手く補完出来ないものもあると思います。
そんな場合は、スニペットを追加することで補うことが可能です。

今回は、簡単に作り方をまとめました。

.sublime-snippetファイルの作成

まず、「〇〇.sublime-snippet」というファイルを新規作成します。
〇〇は、特に決まっていないようなので、自分が管理しやすい名前にするのが良いと思います。
これが、スニペットを記述しておくファイルになります。

保存場所は
User/ユーザー名/ライブラリ/Application Support/Sublime Text 2/Packages/
になります。

ファイル内の記述方法

ファイル内は、以下のように記述します。

■簡単なタグの説明
content:表示させたいコードを記述します。CDATAは必ず記述し、その中の括弧にコードを記述。
tabTrigger:ここに記述した文字列を入力すると、contentのコードが生成されます。
scope:どのファイル形式で有効にするかを指定できます。「source.php」ならphpで有効に。
description:スニペットの説明です。管理しやすいものが良いと思います。

簡単に作ってみると…

一つ作ってみるとこのような感じです!

そのスニペット必要?!という声が聞こえてきそうですが、
プラグイン追加してもhtmlのclassが補完出来ないのが気になっていましたので
簡単な例として作ってみました。

「$1」の部分は補完表示後にカーソルが移動する場所です。
今回はダブルクオーテーションの間にカーソルが自動的に移動することになります。

この状態でファイルを保存して、「<div cl」まで入力したらタブキーを押すと…

スクリーンショット 2014-09-13 15.19.50

こんな感じで補完されました!
作成の際の注意点としては、このファイル一つにつきスニペット一つのようで
もう一つスニペットを作る場合は新規ファイルを作成する必要があるようです。

皆さんはよく使うファンクション等を登録して、有効活用してください!
ファンクションの外側の括弧だけでも、登録しておいたりすれば便利になりそうですね!

Category:Macアプリ , Tools     Tag:
Authorブログの著者について
田中 義弘

田中 義弘

イベントプロダクション・グラフィックデザイナーを経て、2010年3月に株式会社アイデアクラウドを設立。近年、WEBから得た技術をベースに、プロジェクションマッピング事業をはじめとした先端事業をスタート。

Our Business
最近の記事
人気記事
Our Project