じっくり解説！Sublime Text 2 プラグイン 「AutoFileName」

Sublime Text 2 での作業楽しいですね。
そんな作業をもっと楽しくするプラグインの紹介。

今回は、必須ともいえるプラグイン「AutoFileName」です。

htmlやcssを書いているときに、ファイルを指定する事よくあります。
そんな時にめちゃ便利なプラグインです。

例えば、htmlのimgタグを入力中に、別の階層にある画像ファイルを指定する場合、ディレクトリを構造を移動しながら、ファイルを選択して指定することができ、さらに、画像の width heightも自動的にセットしてくれます。

では、インストールから始めましょう。

インストール

メニューバーの「Preferences」から、「Package Control」を選択します。
次に、「Package Control:Install Package」を呼び出します。

“autof”まで入力すると、「AutoFileName」が出てきますのでそれを選択してインストールします。

※Package Controlがインストール背れていない方は、
Sublime Text 2 に Package Control をインストールする
をご覧ください。

使ってみる

htmlファイル内で、“img”と入力し[Tab]キーを押します。
Sublime Text 2の入力補完が効いて、

img →　<img src="" alt="">

と変換されます。

srcの後ろの""に自動的にカーソルがセットされますので、上の階層にいくなら、../ と入力します。
下の階層に行くなら、images/ とかディレクトリ名を入力します。
するとブラウズモードに入ります。次々とディレクトリを移動し、目的のファイルにたどり着いたら、ファイルを選択してEnterです。

すると、ファイルの相対パス名だけでなく、heightとwidthも自動的にセットされます。
とても楽になりますね。

楽しい Sublimeライフを！