今もっともエンジニアに「こいつできる……!」と思わせるエディタ「Sublime text」が流行して久しいですが、今更ながらざっくりと導入方法を。
ずいぶん前にまとめようとして投げ出していたものの自分用に必要となることが結構多いので備忘録的に。
「Sublime Text 2」の導入
Sublime Text 2 β版で3がありますが、パッケージ(プラグイン)の対応具合的にも安定版の2でいいと思います。
パッケージのインストール
まずはパッケージをスマートにインストールするために「Package Controll」というものを導入します。 こちらから、
import urllib2,os,hashlib; h = '7183a2d3e96f11eeadd761d777e62404' + 'e330c659d4bb41d3bdf022e94cab3cd0'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); os.makedirs( ipp ) if not os.path.exists(ipp) else None; urllib2.install_opener( urllib2.build_opener( urllib2.ProxyHandler()) ); by = urllib2.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); open( os.path.join( ipp, pf), 'wb' ).write(by) if dh == h else None; print('Error validating download (got %s instead of %s), please try manual install' % (dh, h) if dh != h else 'Please restart Sublime Text to finish installation')
の文字列をコピーし、Sublime Textの「View > Show Console」に貼り付けてエンター。
ZIPファイルから「Package Controll」を導入する
上記ではインターネット経由で「Package Controll」をインストールしましたが、同じページの「Manual」のところから「Package Control.sublime-package」をダウンロードし、解凍したフォルダを、
C:\Users\ユーザー名\AppData\Roaming\Sublime Text 2\Packages
に格納しても同じことができます。
一度再起動し、Package導入の用意が整いました。
日本語対応
Sublime Textを日本語化するために「Japanize」というパッケージを導入します。
「Preferences > Package Control」で開いたテキストボックスに「install」と入力すると、「Package Control: Install Package」という項目が出てくるはずなのでそちらを選択し、再度出てくるテキストボックスに「japanize」と入力、選択。
さらに、
C:\Users\ユーザー名\AppData\Roaming\Sublime Text 2\Packages\Japanize
上記フォルダ内の「Main.sublime-menu」というファイルを、
C:\Users\ユーザー名\AppData\Roaming\Sublime Text 2\Packages\User
にコピーし、メニューの日本語化完了。
C:\Users\ユーザー名\AppData\Roaming\Sublime Text 2\ackages\Japanize
上記フォルダ内の「.jp」という拡張子のファイル4つを、
C:\Users\ユーザー名\AppData\Roaming\Sublime Text 2\Packages\Default
にコピーし、拡張子を削除(上書き)すると下層メニューの日本語化完了です。
なお、「Package Control」を呼び出すショートカットは「Ctrl + Shift + P(Macだと Command + Shift + P)」です。
日本語の入力対応
デフォルトではファイル内で日本語が入力できません。致命的です。
ので、こちらもパッケージで対応します。
メニューは既に日本語化されているはずなので、「ツール > コマンドパレット」で開いたテキストボックスに「install」と入力、「Package Control: Install Package」という項目を選択し、再度出てくるテキストボックスに「IMESupport」と入力、選択。
以上です。
基本設定
無事日本語化できたら基本的な文字サイズや行間、フォント等の設定をします。
「基本設定 > 基本設定 - ユーザ」で設定ファイル(Preferences.sublime_settings)が新しいタブで開くので、
{
//フォント
"font_face":"Consolas", //Ricty Diminished
//フォントサイズ
"font_size": 10,
//行間
"line_padding_top": 0,
//タブサイズ
"tab_size": 4,
//空白の削除
"trim_trailing_white_space_on_save": true,
//タブやスペースを表示
"draw_white_space": "all",
//現在の行をハイライト表示
"highlight_line":true,
//自動改行
"word_wrap": true
}
等で変更できます。 各種お好みで。
「UTF-8」以外の文字コードに対応する
デフォルトでは「UTF-8」以外の文字コードのファイルを開くと文字化けするので、ファイルを開く際にファイルをそっと「UTF-8」に変換し、保存する際に元の文字コードにそっと戻してくれるパッケージ「ConvertToUTF8」を導入します。
「ツール > コマンドパレット」に「install」、「Package Control: Install Package」で「converttoutf8」。
終わり。
ここまでのパッケージのインストールでは「PackageControl」を利用しましたが、公式ディレクトリに登録されておらずGithub等で公開されているパッケージは、zipファイルを解凍して、「C:Usersユーザー名AppDataRoamingSublime Text 2Packages」に放り込めば同じように導入できます。念の為。
おすすめのパッケージ
上記で基本的な設定はおしまいです。 下記には、とりあえず入れておくと便利なパッケージを列挙します。
Tag
閉じタグの入力補完。
IndentGuides
インデントをガイド線で可視化。
TrailingSpaces
半角スペースと全角スペースをわかりやすくしてくれたりするパッケージ。
HTML
HTMLの入力補完。
HTML5
HTML5の入力補完。
CSS Snipets
CSSの入力補完。
BracketHighlighter
HTMLの閉じタグをハイライト。
Emmet
ご存知HTMLとCSSの高速コーディングを可能とするEmmetさん。
CSScomb
CSSのプロパティの並びを整えてくれるパッケージ。PCにPHPがインストールされている必要があります。
Compass
CSSを便利でスマートにする「Sass」のフレームワーク「Compass」のパッケージ。
同時に「Sass」「SASS Build」「SCSS」「SCSS Snippets」のパッケージと、PCにRubyがインストールされていないと動きません。
Wordpress
WordPressの入力補完。
AndyPHP
PHPの入力補完。
AndyJS2
JSとjQueryの入力補完。
SideBarEnhancements
サイドバーで右クリックしたときのメニューを充実させるパッケージ(日本語化可)。
さいごに
ここでは僕がよく使うもののみまとめたため、FTP系やGit系やターミナル系のパッケージ関連にはあまり触れられていません。
さらに、一切触れていませんがショートカット関連もかなり奥深いです。
検索するとかなり恋に落ちてるエンジニアさんがまとめた情報等もあるので、ぜひ調べてみてください。
ではでは。