目次
sublimetext2から3への変更
sublimetext2で利用していたパッケージも徐々に、sublimetext3でのアップデートに切り替えている雰囲気を察知したのをきっかけに、sublimetext3を利用し始めました。sublimetext3に変えたときに、そのまま移行させたわけではなく、これをきっかけに、必要なパッケージや設定をもう一度再考しましたので、その設定メモを残しておきます。
installpackageを利用できるようにする。
まずは、installpackageを利用できるようにします。以下のURLから、sublimetext3のinstallpackage用のコードをコピーします。
https://sublime.wbond.net/installation#st3
コンソールを開いて、(View- > Show Console)コードをペーストし実行して、sublimetext3を再起動します。
Preferences -> PackageControl から Instとか打つと、InstallPackageが利用することができるようになります。
導入したpackage
以下に紹介しているpackageは、すべてInstallPackageからいれることができます。(2014年4月26日現在)
AutoFileName
プロジェクトで利用すると、画像ファイルとかの入力補完をしてくれる。BracketHighlighter
divとか{}とかの組み合わせを色付けして強調して見やすくしてくれる。CSScomb
CSSを整形してくれる。PackageSettingから、順番の指定も可能。
Hayaku
CSSを書くのにすごく便利なツール。/hayaku/
SublimeCodeIntel
シンタックスハイライトや自動入力補完Tag
HTMLなどの閉じタグの入力を補完を強化してくれます。右クリック Auto−Format > Tags on Document でコード整形もできる。
SideBarEnhanements
ファイルを移動したりなど、ファイル操作ができるようになります。右クリックでのメニューも充実します。
RecentActiveFiles
最近開いたファイルをリスト表示cmd + K
LocalHistory
ファイルの変更履歴を自動で保存してくれるUsers/ユーザー名/.sublime/history に保存される
AllAutocomplete
コード補完してくれる。Color Highlighter
カラーコードを選択すると、選択範囲にその色が表示される。直感的で素敵。
Alignment
CSSのコードのtab整形をしてくれる
cmd + ctr + A
jQuery
jQueryのスニペットです。
Emment
3にしたついでに、利用を始めました。
Zen-Codingがどうもなじまなくて、手をつけていませんでしたが、いざ使ってみると使いやすくて便利です。
BoundKeys
Tools -> CommandPaletで、「List bound keys」 を実行すると、自分で入れたpackageなどを含めた、ショートカットキーの一覧がすべて表示されます。
これを元に自分専用のショートカットを考えていきます。
PrefefencesのUserの設定
jsonで指定した設定内容です。
Prefefences > Setting – User
別ページにまとめました。
Prefefences > Color scheme
Twilight を使っています。なんとなく。
Prefefences > Package Settings > Emment > Setting – User
hayakuを利用するため、css利用時のバッティングを回避します。
1234567891011121314
{ // hayakuを利用するため、cssのバッティングを回避 // A comma-separated list of scopes where Emmet’s Tab key // abbreviation expander should be disabled "disable_tab_abbreviations_for_scopes": "css.scss", // 変換をtabだけにする // A comma-separated list of disabled action names. // Listed action will not be triggered by default keyboard // shortcut. // Use "all" value to disable all shortcuts at once "disabled_keymap_actions": "expand_abbreviation"}
Alignment
CSSのコードのtab整形をしてくれるcmd + ctr + A
jQuery
jQueryのスニペットです。Emment
3にしたついでに、利用を始めました。Zen-Codingがどうもなじまなくて、手をつけていませんでしたが、いざ使ってみると使いやすくて便利です。
BoundKeys
Tools -> CommandPaletで、「List bound keys」 を実行すると、自分で入れたpackageなどを含めた、ショートカットキーの一覧がすべて表示されます。これを元に自分専用のショートカットを考えていきます。
PrefefencesのUserの設定
jsonで指定した設定内容です。Prefefences > Setting – User
別ページにまとめました。Prefefences > Color scheme
Twilight を使っています。なんとなく。Prefefences > Package Settings > Emment > Setting – User
hayakuを利用するため、css利用時のバッティングを回避します。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
{ // hayakuを利用するため、cssのバッティングを回避 // A comma-separated list of scopes where Emmet’s Tab key // abbreviation expander should be disabled "disable_tab_abbreviations_for_scopes": "css.scss", // 変換をtabだけにする // A comma-separated list of disabled action names. // Listed action will not be triggered by default keyboard // shortcut. // Use "all" value to disable all shortcuts at once "disabled_keymap_actions": "expand_abbreviation" } |
ターミナルから開く設定を変更
zshを利用しているので、.zshrcの内容に追加#sublimetext3を st で起動
1 |
alias st="/Applications/Sublime\ Text.app/Contents/SharedSupport/bin/subl" |
ちなみに、sublimetext2の場合は、こちらだったので、2の部分を削除して修正しました。
#sublimetext2を st で起動
1 |
alias st="/Applications/Sublime\ Text\ 2.app/Contents/SharedSupport/bin/subl" |
sublimetext2から3へのアップグレードについて
ちなみに、sublimetext2を購入した人ですが、リリース後、アップグレードができるようになるらしいです。beta版では、sublimetext2で購入していたライセンスをsublimetext3に入力すれば、そのまま使うことができます。

おわりに
ここに書いていない部分で言うと、会社の人が作った便利なキーバインド設定と、記事を書いてから変更した部分があります。変更した内容は、またver2の記事として書きたいと思います。