Sublime Text 3のカスタマイズまとめ(Package Control使用)

Sublime Text

Sublime Text 3 インストール後の設定。

メニューの日本語化、日本語のインライン入力、全角スペースのハイライト、以前作ったSHIFT-JISなどの文字化け防止、スニペットの追加やその他設定などをまとめました。

普段、Web制作にはSublime Textを使用しています。Sublime Text 3に変えよう変えようと思いながら、今更ながら変更しました(笑)

Sublime Text 2 の時は、初めてでパッケージコントロールとかも使わずに試行錯誤しながらだったので時間かかりましたが、今回はサクッと終わりました。

学生の皆さんも自分の環境は自分で作ってみましょう!

Sublime Text のダウンロード

Sublime Text 3

 

まずは、「Package Control」のインストール

Sublime Textを起動して、メニューから「View」-「Show Console」と選択。

Show Console

こちら(Package Control)からバージョンにあったものをコピーして

Installation Package Control

矢印の部分に貼り付けてEnterキーを押します。

Installation Package Control

 

メニューの日本語化 「Japanize」

メニューから「Preferences」-「Package Control」と選択します。

Package Control

Package Controlで「Install Package」を選択しますが、最初の数文字を入力するとリストが絞り込みされて表示されます。

Package Control

日本語化のパッケージ「Japanize」を選択しますが、これも最初の数文字を入力すると絞り込んで表示されます。

日本語化 「Japanize」

「Japanize」を選択するとエディタ内にファイルコピーなどの指示が表示されるので、それに従います。

日本語化 「Japanize」

 

日本語入力のインライン化「IMESuport」

日本語化したのでメニューの表示が変わってますので、メニューから「基本設定」-「Package Control」と選択します。

リストから「Install Package」を選択し、更に「IMESuport」を選択すればOKです。

 

全角スペースをハイライト「Trailing Spaces」

「Package Control」で「Trailing Spaces」を選択します。

「基本設定」-「Package Settings」-「Trailing Spaces」-「Settings – User」 を選択し、次の設定用コードをコピペして保存するだけでOKです。

{
"trailing_spaces_regexp": " |[ \t]+"
}

 

文字化け防止「ConvertToUTF8」

以前作ったSHIFT-JISなどのファイルを編集するために、「ConvertToUTF8」をインストールします。

「Package Control」で「ConvertToUTF8」を選択します。

 

スニペットの追加

HTMLなどテンプレートなどがあればファイルを作ることでスニペットに登録できます。

Sublime Text 2で使っていたスニペットがあれば、そのまま使えます!が、適当に保存してるとファイルがどこにある分からなくなります。実際探しました(汗)

ファイルは、「Packages」フォルダ以下であればどこでも良いらしいので、フォルダを作ってまとめました。

 

最後に、その他の設定

「カーソル行のハイライト」や「行末の空白を保存時に削除」など

メニューから「基本設定」-「基本設定 – ユーザ」を選択し、まるまるコピペするか、必要な部分だけコピペします。
※最後の行はカンマを省きます。

{
	//テキストエリアの色合い
	"color_scheme": "Packages/Color Scheme - Default/Monokai.tmTheme",
 
	//スペースの描画(none、selection、all)
	"draw_white_space": "selection",
 
	//文字サイズ
	"font_size": 12,
 
	//カーソル行のハイライト
	"highlight_line": true,
 
	//行末の空白を保存時に削除
	"trim_trailing_white_space_on_save": true,
 
	//ガーターとコードの間(スペースを節約したいかたは少なめに)
	"margin": 0,
 
	//自動折り返し(横スクロールが嫌いな方はtrueに)
	"word_wrap": false,
 
	//終了時の確認 true(なし) false(あり)
	"hot_exit": false,
 
	//レジューム機能
	"remember_open_files": false
}

その他の設定も色々あるので、ググって自分でカスタマイズしてください。

 

学生からたまに言われるのが、「Sublime Textをダウンロードしたんですけど、スニペットにHTML5が出てこないんです。」

授業中にサクッと制作を始められるように最低限必要なタグで初期のテンプレートを作ってスニペットに登録してるんです。で、それが出てこないと。まぁ、出てこないでしょうね(笑)

スニペットは自分で作れるので、ググって作ってみてください!

関連記事