Skip to content →

ST2 pkgs

Sublime Text 2 Packages for Web Developers.

2012年11月9日(金)に開催された『CPI × CSS Nite 「After Dark」(5)』で最後に配布したSublime Text 2のパッケージ一覧のアップデート版です。

※最新版はこちらのGistをご覧ください。

Webサイトの制作者に有用そうなものを

こもりが使っているモノやそうでないものも含め、なんとなくWebデザイナーやWebデベロッパーな人たちに便利そうなのを集めています。

ここに挙げたものは、類似のパッケージがあるものも存在するので、Package Controlや「Sublime Text Packages by the Community」などでキーワードで検索してみると良いでしょう。

LESS/Sass/SCSSなどCSSプリプロセッサの自動ビルド系パッケージは、あらかじめそれぞれの実行ファイルのインストールが必要、かつコンパイル先やコマンドの位置を設定ファイルに書く必要があります。

※入れすぎると起動時に遅くなったりするので、そこは各自の判断で。


AndyJS

JavaScriptとjQueryの入力補完。

AndyPHP

PHPの入力補完。その他、多くの言語の入力補完がセットになった「AndySublime」というパッケージも。

ApacheConf

HTTPサーバであるApacheの.confファイルや.htaccessファイルの入力補完やカラーリング。

AutoFileName

HTMLとかCSSで画像などのファイル名をディレクトリから取得し、サイズまで自動で挿入する。

Backbone.js

Backbone.jsのスニペットと入力補完。

BracketHighlighter

ブラケットに囲まれた部分をハイライトしてくれる。

Clipboard History

Sublime Text 上でコピーしたもののクリップボード管理。

CoffeeScript

CoffeScriptのシンタックスハイライトやスニペットなど。

ColorPicker

システム標準のカラーパレットを呼び出して挿入する。

ConvertToUTF8

UTF-8にしか対応していないSublime Text 2でドキュメントの文字コードを変換・保存できる。

CSS Media Queries Snippets

Media Queriesのスニペット集。「med」を入力して、Ctrl+Spaceで候補選択。

CSScomb

CSSのプロパティの順番をきれいにする「CSScomb」を実行。ショートカットは「Ctrl+Shift+C」。似たようなのにCSSLisibleな「CssLisible」というのもある。

emmet-sublime

Zen-Codingの次期バージョン「Emmet」のSublime Text 2版。

Encoding Helper

Sublime Text 2の文字コードをいろいろ変換する。ConvertToUTF8と違って、こちらは変換するだけ。

Gist

Gistからファイルを開いたり、追加したり編集したり。

Git

コマンドパレットからGitの各種コマンドを選択・実行できる。

GotoRecent

起動してから開いたファイルをリストする。呼び出しは「Ctrl+Shift+R」。

Goto CSS Declaration

開いているHTMLのカーソル位置から該当セレクタを開く(CSS/Sass/LESS)。

HQX to RGBA

16進数のカラーコードを、RGBAに変換する。

HTML Compressor

HTMLをMinifyするビルドツール。呼び出しは、Buildのとこから。CSSやJSもいけるみたい。

HTML Mustache

HTMLでMustacheのシンタックスを有効にする。

IMESupport

Windowsで日本語の入力がうまくいかない環境へ対応する。インストールはこちらの配布サイトから

Inc-Dec-Value

テキスト中に含まれる数字などを増減する。修飾キーと上下矢印キーで値を増減。16進数なども。

jQuery

いわずもがなjQueryの。

jQuery Snippets pack

こちらもjQueryのスニペット。

JsMinifier

JavaScriptのMinifier、GoogleのClosure Compilerを使用。

LESS

LESSのファイル(.less)のシンタックスハイライト。

LESS-build

LESSのビルドシステム。あらかじめNode.jsを使って「less」のインストールが必要。

LiveReload

LiveReloadのブラウザエクステンションなどと連動して自動リロード。

Local History

保存毎にファイルのバージョン管理をしてくれるパッケージ。差分も表示可能。

Mac Terminal

開いているファイルのパスをターミナルで開く。

Markdown Preview

Markdownの書類をプレビューする。

Nettuts+ Fetch

あらかじめ登録したライブラリやフレームワークのファイルをダウンロード。.zipなどのパッケージの場合はダウンロードして解凍まで。使い方はNet Tuts+の説明を。→こもりのFetchの設定ファイル

nginx

Nginxのシンタックスハイライト。.confファイルの編集とかをわかりやすく。

Nodejs

Node.jsのコード補完や各種コマンドの実行。あと「node」で補完されるスニペット。

OmniMarkupPreviewer

Markdownやそれ以外の各種テキストファイルをブラウザでプレビュー。MarkdownはGitHubのスタイルで確認可能。

Package Control

これがないと管理が面倒。神様のようなSublime Text 2のパッケージ管理プラグイン。

Pandoc

Pandocを使って、ドキュメントフォーマットをいろいろ変換してくれる。Pandocのインストールが必要。

PhpTidy

WordPressのコーディングガイドラインにあうようにカスタマイズされたPhpTidy。

Placeholders

HTMLのテンプレートやLorem Ipsumの固まったテキスト、プレイスフォルダーイメージなどを挿入できるスニペット。

Prefixr

CSSのベンダープリフィックスを付ける。

Ruby Slim

Slimのシンタックスハイライト。パッケージオフィシャルなし。

Sass

Sass/SCSSのシンタックスハイライトと入力補完。

SASS build

Sassのビルドシステム。あらかじめSassのインストールが必要。

SCSS

SCSSのシンタックスハイライトやスニペット、コマンドを追加する。次の「SCSS Snippets」とスニペットが重複する。

SCSS Snippets

SCSSのスニペット集。「+」でinclude、「++」でextendとか。

Search Stack Overflow

選択した単語からStack Overflowで検索。似たようなのにWordPressのCodexを検索するものもある。

SublimeOnSaveBuild

各種ファイルにあわせて保存と同時に登録済みのビルドシステムでビルドする。初期設定は「CSS/JS/Sass/SCSS/LESS」。

Sublime SFTP

有償だが、Sublime Text 2から直接SFTPを可能にする。ファイルの同期とかも。

SideBarEnhancements

あるとないとでは大違いのサイドバー拡張なパッケージ。

SideBarGit

パッケージ「Git」があればいらないけど、サイドバーとかコンテキストメニューからGitを操作。

Strapdown.js Preview

Markdownの書類をTwitter Bootstrapのテーマでプレビュー。ST2内でプレビューも可。

StringEncode

文字列のエンコード・デコードをおこなうパッケージ。

Stylus Package for Sublime Editor 2

Stylusのビルドシステムとシンタックスハイライト。

Sublime PHP Builtin Web Server

PHP 5.4.xから入っているサーバを有効にする。サーバの操作はコマンドパレットから。

SublimeCodeIntel

元々ある程度補完するST2をさらに強力に自動補完。言語別にオンオフもできる。

SublimeSuperSelect

Cmd+Dを拡張する。任意の単語を順番に、スキップしながら、反転するなど。使い方は公式サイトを参照。

Sublime Finder

開いてるプロジェクトのルートディレクトリをFinderで開く。「Reveal Finder」みたいなもん。

Sublime-HTMLPrettify

HTML、CSS、JavaScriptをPrettifyしてくれる(キレイに成型してくれる)。要、Node.js。

Sublime Server

簡易的なHTTPサーバを裏で起動するパッケージ。初期設定のポートは「8080」。自動起動も可能。

Sublime Surround

任意のカーソルの位置、選択状態のテキストから周辺にある特定の文字を置き換えたり消したり。

Sublime Terminal

開いているフォルダのルートディレクトリをターミナルで開いてくれる。

WordCount

文書中の文字数をカウント。日本語も大丈夫。原稿などを書く人にも。

WordHighlight

選択したテキストをハイライトする。

WordPress

いわずもがなWordPressのシンタックスハイライトやスニペット。

YUI Compressor

YUI CompressorでCSSやJSを圧縮。OS XやLinuxならファイルを開いてF7、Cmd+Bで。

ZenCoding

HTMLやCSSのスニペット集であるZen-CodingのSublime Text 2版。

Zen Gardern

CDN経由のjQueryやOGPなどのコードスニペット。Zen-Codingがあっても問題なし。