Sublimetext2を導入してみた
SublimeText 2 を導入しましたので、導入方法を紹介します。
SublimeText 2 をダウンロードする。
公式のサイト（http://www.sublimetext.com/2）から、自分の環境にあったファイルをダウンロードしてきてください。
※OSは、Windows,Mac,Linux に対応しています。
初期設定
アプリを立ち上げて、Sublime text2 → Preference → Settings Userを開く。
ショートカットキーは、 command + , です。
「Preferences.sublime_settings」のタブが立ち上がります。
私は下記の設定を記述しました。
他にもいろいろ設定出来るみたいなので検索していろいろ設定してみて下さい。
設定を保存して再起動をします。
{
//フォントサイズ
"font_size": 12,
//行間
"line_padding_top": 5,
//タブサイズ
"tab_size": 4,
//タブやスペースなどの不過視文字を表示
"draw_white_space": "all",
//現在の選択行をハイライト表示
"highlight_line":true,
//自動改行
"word_wrap": true
}
作業がしやすい環境にするためPackageをインストール
Packageとは、作業がしやすくするための拡張機能のことです。
Packageをインストール出来るように準備をする
Packageをインストールするためには、「Package Control」が必要になるのでインストールします。
View → Show Console を選択すると、画面の一番下に枠が表示されカーソルが点滅されています。この枠の中に、下記のコードを記述します。
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')
記述したら Enter を押し実行して SublimeText 2 を再起動（ SublimeText 2 を終了して起動）します。
SublimeText 2 → Preferences → Pacage Control が表示されたらOKです。
これで、 Package をインストールする準備が整いました。
※記述したコードはこちら（ https://sublime.wbond.net/installation#st2 )を参考にしました。
Packageをインストール
まず、インストールの方法を教えます。
①Ctrl+Shift+P を押すと画面が出てきますので、install と入力し検索すると「Package Control:Install Package」が表示されるのでクリックします。
②新たに違う画面が出てきますので、インストールしたいPackage名を入力して検索してインストールしたいPackageクリックします。
クリックするだけでインストールされます。
おすすめPackage
Japanize：メニュー表示を日本語にする
IMESupport：日本語を入力する時に、エディタ内の現在行で入力できるようにする。(Winのみ)
AutoFileName：imageやlinkでファイルを扱う際、フォルダ名・ファイル名を一覧から選択できるようにする。imgタグでは、height,widthも自動取得してくれます。
Markdown Extended：Markdown 内のコードをシンタックスハイライトする
Markdown Preview：ブラウザでプレビュー確認ができる ※1
BrowserRefresh : ファイルを保存すると同時にブラウザのプレビューを更新 ※2
View in Browser : ブラウザでプレビュー確認ができる
Live Style：ブラウザプレビューのリアルタイム更新
LIve Reload：ファイル保存のたびにブラウザを自動リロードしてくれる
QuickLook：Macのクイックルックみたいな感じでプレビュー
OmniMarkupPreviewer：ファイルの編集中にプレビューすることができます
※1 Markdown Previewを実行させるには次の設定が必要になります。
Sublime Text 2 → Preferences → Key Bindings -User を選択します。
以下のように書き換え保存します。
[ { "keys": ["alt+m"], "command": "markdown_preview", "args": {"target": "browser"} }]
これでプレビュー表示が出来るようになります。
Alt+m を押せばMarkdownをプレビュー出来ます。
参考サイト（ コードで一言 http://codedehitokoto.blogspot.jp/2012/04/sublimetext2markdown.html ）
※2 cmd+shift+r でブラウザが更新されます。
Packageを紹介しているサイトを紹介しますのでこちら(SublimeTextの教科書で紹介されてるプラグインまとめ http://qiita.com/maccotsan/items/f320036e19f8d3b798c1 )をチェックしてください。
ファイルをダウロードして設定する
ダウンロードしないとインストールできないPackagを紹介します。
全角スペースをハイライト表示
全角スペースを明確に表示(ハイライト)するPackageです。
下記ファイルをダウンロードし、解凍(展開)します。
ZenkakuSpacet.zip ←クリック
解凍したら 「FullPitchWhiteSpaceHighlight 」フォルダを「コピー」します。
SublimeText2 → Preferences → Browse Package･･･ を選択する。
「Packages」フォルダの中に「FullPitchWhiteSpaceHighlight 」フォルダを貼付け貼付けます。
メニューを日本語化
メニューや右クリックした時のコンテキストメニューが日本語表示になるPackageです。
下記のリンクファイルをダウンロードします。
メニューバー( Main.sublime-menu : 50,537 Byte)
https://docs.google.com/open?id=0B_dAu5x064QTWW5TQ2p0NzRPZTQ
コンテキストメニュー( Context.sublime-menu : 688 Byte)
https://docs.google.com/open?id=0B_dAu5x064QTZ1lZaXpmS3ZMQ0U
リンクをクリックすると、ダウンロードボタンが出てくるのでダウンロードボタンを押してダウンロードして下さい。
ダウンロードした2ファイルを「コピー」し、SublimeText2 → Preferences → Browse Package･･･ を選択する。
「Packages」フォルダの中の「Default」フォルダの中にコピーしたファイルを貼り付け(上書きとなります)ます。
画面の色変更
「現在行のハイライト表示」・「選択部分の色」を、初期のカラースキーマ「Monokai」を一部変更した「Monokai Kai」ファイルです。
下記ファイルをダウンロードし、解凍(展開)します。
解凍したら 「Color Scheme - User 」フォルダを「コピー」します。
SublimeText2 → Preferences → Browse Package･･･ を選択する。
「Packages」フォルダの中に「Color Scheme - User 」フォルダを貼付け貼付けます。
SublimeText2 → Preferences → Color Scheme → Color Scheme - User → Monokai Kai を選択します。
覚えておきたいメニュー・ショートカット等
メニュー
View → Side Bar → Show･･･ / Hide･･･：画面左側に出るファイル名等のサイドバーを表示/非表示。
View → Hide Minimap / Show Minimap：画面右側に出るコードの全体表示ミニマップを表示/非表示。
：画面を指定した数に分割。左画面でhtml、右画面でcssといった事ができる。
Single：1画面 Columns：列＜垂直方向の並び＞ Rows：行＜水平方向の並び＞
View → Word Wrap：コードを画面右端で自動折り返しにする/しない。
ショートカット
Ctrl + S：上書き保存
Ctrl + +：文字サイズを大きく
Ctrl + -：文字サイズを小さく
他
[Esc]キー：PacageControlボックスや検索ボックス等の、ボックスを閉じる。
html + [Tab]キー：htmlの雛形コード入力(htmlのタグ等他にもたくさんあります)。
htmlファイルの編集画面上で右クリック→[Open in Browser]：htmlファイルをブラウザで表示。
参考にしたサイト
Installation - Sabulime Package Control
SublimeTextの教科書で紹介されてるプラグインまとめ - Qiita
