フロントエンジニア用、Sublime Text 3 プラグイン

Sublime Text 3 の普段使っているオススメのプラグイン(パッケージ)を紹介いたします。

必須プラグイン

ConvertToUTF8

ファイルをUTF8に変換して開いてくれる。
Sublime Text 3 の場合は、別途、コーデックが必要。https://github.com/seanliang/Codecs33からコーデックをダウンロードして、解凍したフォルダを「Codecs33」に変更して「Sublime Text 3」フォルダの下にある「Packages」フォルダ直下に入れ、再起動。

Emmet

少ないタイプや補完機能でコーディング効率化。
「PyV8」というプラグインも同時にインストールされます。

AutoFileName

img要素のsrcとwidthとheightの補完。
(Macの場合)Preferences → Settings-User から、

"afn_insert_width_first": true,//AutoFileNameプラグイン用

を追加して、heightよりもwidthが先に来るように設定。

BracketHighlighter

括弧をわかりやすく。

便利プラグイン

SideBarEnhancements

サイドバーの右クリックメニューを増やす。

SyncedSideBar

開いているファイルと、サイドバーの同期。

GitGutter

Gitを使っている場合に、差分がある場所にマークがつく。

CSS Snippets

CSSの補完。

jQuery

jQueryの補完。

SCSS

SCSSファイルをカラーリング。
コマンドパレット(Macの場合、shift + command + P)から「Set Syntax: SCSS」

まとめ

これがすべてというわけではないですが、特に使えそうなものを選んでみました。

あまりに多くなってくると、管理したりショートカットキーを覚えたりするのが面倒になってきますね。ショートカットキーの競合も起きたり。あとは、便利だったけど配布されていなかったり、使えなくなっていたりするのも多々ありますね。