Sublime Text の設定


このメモは Mac ( OS X ) の Sublime Text 3 での使用を前提としています。

## 環境設定

Sublime Text -> Preferences -> Settings User

```js:Preferences-sublime-settings
{
	// テーマを設定
	"theme": "Soda Light 3.sublime-theme",
	// タブを丸みのあるスタイルに設定
	"soda_classic_tabs": true,
	// サイドバーのフォルダアイコンをSoda仕様に設定。
	"soda_folder_icons": true,
	// カラースキーム
	// "color_scheme": "Packages/Color Scheme - Default/Monokai.tmTheme",
	"color_scheme": "Packages/Monokai Extended/Monokai Extended.tmTheme",
	// サイドバーのフォルダを太文字にする
	"bold_folder_labels": true,
	// 開いているファイルが無くなったらアプリケーションを閉じる
	"close_windows_when_empty": true,
	// 起動した時に新規ウインドウを開かない。
	"create_window_at_startup": false,
	// デフォルトのエンコーディング。
	"default_encoding": "UTF-8",
	// 文字コードを特定できないときに自動的に指定する文字コード。
	"fallback_encoding": "Shift-JIS",
	// デフォルトの改行コード。
	"default_line_ending": "unix",
	// エンコーディングを表示
	"show_encoding": true,
	// 改行コードを表示
	"show_line_endings": true,
	// カーソルのスタイルを変える
	// Default: smooth, Etc: phase, blick, solid, wide
	"caret_style": "smooth",
	// ミニマップの縁を描画する。
	"draw_minimap_border": true,
	// インデントの補助線の描画。
	"draw_indent_guides": true,
	// インデントの補助線のオプション
	"indent_guide_options": [
		"draw_active"
	],
	// 空行のインデントを取り除く。
	"trim_automatic_white_space": true,
	// スペースの描画。none:描画しない。selection:選択時のみ描画。all:常に描画。
	"draw_white_space": "all",
	// スペースのハイライトの色。
	// Default: invaild
	"trailing_spaces_highlight_color": "comment",
	"trailing_spaces_regexp": "　|[ \t]+",
	// ファイルの最終行を改行で終わらせる。
	"ensure_newline_at_eof_on_save": true,
	// フォントの種類
	"font_face": "Consolas",
	// フォントサイズ
	"font_size": 16.0,
	// 現在行を強調する。
	"highlight_line": true,
	// 変更されたタブを強調。文字色が変わるようになる。
	"highlight_modified_tabs": true,
	// 無視するパッケージ。
	// "Vintage"をignored_packagesから外せば、Sublime Text をVimっぽくすることができる。
	"ignored_packages": [
		// "Vintage"
	],
	// ビルドシステムのパスをオリジナルのパスに
	//"build_env": {
	//	"PATH": "/usr/local/bin"
	//},
	// 行の上側の余白。
	"line_padding_top": 5,
	// 行の下側の余白。
	"line_padding_bottom": 5,
	// 括弧内での括弧の強調。
	// falseにするとカーソル上に括弧がある場合のみ、括弧にアンダーラインを引く。
	"match_brackets_content": true,
	// 対応する山括弧<>の強調。
	"match_brackets_angle": true,
	// 対応する波括弧{}の強調。
	"match_brackets_braces": true,
	// 対応する四角括弧[]の強調。
	"match_brackets_square": true,
	// ファイル先頭行及び最終行における上下移動の振る舞い。
	"move_to_limit_on_up_down": true,
	// ファイルを開く際に新しいウィンドウで開く。OS Xのみの機能。
	"open_files_in_new_window": false,
	// クリックでファイルをプレビュー。
	// サイドバーのファイルをクリックした際にタブを作らずに内容を表示。
	"preview_on_click": true,
	// ファイル最終行を越えたスクロール。
	"scroll_past_end": true,
	// スクロールの速度。0にするとスムーズスクロールが無効になる。
	"scroll_speed": 3.0,
	// Shit+Tabでインデントを減らす。
	"shift_tab_unindent": true,
	// タイトルバーにファイルのフルパスを表示。
	"show_full_path": true,
	// タブのサイズ
	"tab_size": 4,
	// タブ文字をスペースに変換。
	"translate_tabs_to_spaces": true,
	// 保存時に行末の空白を削除する。
	"trim_trailing_white_space_on_save": false,
	// OS X 用の設定。Lionスタイルのフルスクリーンモードを無効にする。
	"use_simple_full_screen": true,
	// テキストを折り返す。
	"word_wrap": false,
	// どこで折り返すか。
	// 0ならウインドウの幅。それ以外ならその数値分の文字数で折り返される。
	"wrap_width": 120,
	// 英語キーボード以外でEmmetを使う場合は false にするとかしないとか
	"enable_emmet_keymap": false,
	// Emmetを有効にすると、HTMLで「php」の展開が「<?php ?>」にならない問題の回避
	"disabled_single_snippet_for_scopes": "",
	// Emmetを有効にすると、日本語変換確定後に文字が消えるのを防ぐ
	"disable_formatted_linebreak": true,
}
```

## PackageControl のインストール

1. [Installation - Package Control](https://sublime.wbond.net/installation#st3) よりインストール用コードをコピーする。
2. ``control + ` `` でコンソールを起動し、1 でコピーしたコードをペーストし ``Enter`` を押下する。
3. Sublime Text を再起動し終了。

## Package のインストール

1. ``⌘ + shift + p`` でPackageControlを開く。
2. install package を選択。
3. Package を検索してインストール。

### Package リスト
* ApacheConf.tmLanguage
* Compass
* CSScomb JS
* ConvertToUTF8
* Codecs33 for ST3
* DocBlockr
* Dotfiles Syntax Highlighting
* Emmet
* Emmet CSS Snippets
* SASS
* SASS Build
* SASS Snippets
* SCSS
* SCSS Snippets
* SideBarEnhancements
* Markdown Extended
* Monokai Extended
* OmniMarkupPreviewer
* Trailing Spaces

### Package リスト ( 要検討 )
* SublimeCodeIntel
* SublimeLinter
* SublimeOnSaveBuild
* Local History

## Package の設定
### CSScomb JS

Sublime Text -> Preferences -> Package settings -> CSScomb JS -> Settings User

```js:CSScombjs.sublime-settings
{
    // If you want to use custom config, put file named `.csscomb.json` to the
    // project's root or your HOME directory. If for some reason you would like
    // to set custom path to configuration file, paste it here.
    // For example, "/Users/csscomb/project/config/csscomb.json"
    "custom_config_path": "/Users/YOUR USERNAME/.csscomb.json",
}
```

```js:.csscomb.json
{
    "exclude": [
        ".git/**",
        "node_modules/**",
        "bower_components/**"
    ],
    "always-semicolon": true,
    "block-indent": "    ",
    "tab-size": "4",
    "color-case": "lower",
    "color-shorthand": true,
    "element-case": "lower",
    "eof-newline": true,
    "leading-zero": false,
    "quotes": "single",
    "remove-empty-rulesets": true,
    "space-after-colon": " ",
    "space-after-combinator": " ",
    "space-after-opening-brace": "\n",
    "space-after-selector-delimiter": "\n",
    "space-before-closing-brace": "\n",
    "space-before-colon": "",
    "space-before-combinator": " ",
    "space-before-opening-brace": " ",
    "space-before-selector-delimiter": "",
    "strip-spaces": true,
    "unitless-zero": true,
    "vendor-prefix-align": true,
    "sort-order": [
        [
            "font",
            "font-family",
            "font-size",
            "font-weight",
            "font-style",
            "font-variant",
            "font-size-adjust",
            "font-stretch",
            "font-effect",
            "font-emphasize",
            "font-emphasize-position",
            "font-emphasize-style",
            "font-smooth",
            "line-height",
            "position",
            "z-index",
            "top",
            "right",
            "bottom",
            "left",
            "display",
            "visibility",
            "float",
            "clear",
            "overflow",
            "overflow-x",
            "overflow-y",
            "-ms-overflow-x",
            "-ms-overflow-y",
            "clip",
            "zoom",
            "flex-direction",
            "flex-order",
            "flex-pack",
            "flex-align",
            "-webkit-box-sizing",
            "-moz-box-sizing",
            "box-sizing",
            "width",
            "min-width",
            "max-width",
            "height",
            "min-height",
            "max-height",
            "margin",
            "margin-top",
            "margin-right",
            "margin-bottom",
            "margin-left",
            "padding",
            "padding-top",
            "padding-right",
            "padding-bottom",
            "padding-left",
            "table-layout",
            "empty-cells",
            "caption-side",
            "border-spacing",
            "border-collapse",
            "list-style",
            "list-style-position",
            "list-style-type",
            "list-style-image",
            "content",
            "quotes",
            "counter-reset",
            "counter-increment",
            "resize",
            "cursor",
            "-webkit-user-select",
            "-moz-user-select",
            "-ms-user-select",
            "user-select",
            "nav-index",
            "nav-up",
            "nav-right",
            "nav-down",
            "nav-left",
            "-webkit-transition",
            "-moz-transition",
            "-ms-transition",
            "-o-transition",
            "transition",
            "-webkit-transition-delay",
            "-moz-transition-delay",
            "-ms-transition-delay",
            "-o-transition-delay",
            "transition-delay",
            "-webkit-transition-timing-function",
            "-moz-transition-timing-function",
            "-ms-transition-timing-function",
            "-o-transition-timing-function",
            "transition-timing-function",
            "-webkit-transition-duration",
            "-moz-transition-duration",
            "-ms-transition-duration",
            "-o-transition-duration",
            "transition-duration",
            "-webkit-transition-property",
            "-moz-transition-property",
            "-ms-transition-property",
            "-o-transition-property",
            "transition-property",
            "-webkit-transform",
            "-moz-transform",
            "-ms-transform",
            "-o-transform",
            "transform",
            "-webkit-transform-origin",
            "-moz-transform-origin",
            "-ms-transform-origin",
            "-o-transform-origin",
            "transform-origin",
            "-webkit-animation",
            "-moz-animation",
            "-ms-animation",
            "-o-animation",
            "animation",
            "-webkit-animation-name",
            "-moz-animation-name",
            "-ms-animation-name",
            "-o-animation-name",
            "animation-name",
            "-webkit-animation-duration",
            "-moz-animation-duration",
            "-ms-animation-duration",
            "-o-animation-duration",
            "animation-duration",
            "-webkit-animation-play-state",
            "-moz-animation-play-state",
            "-ms-animation-play-state",
            "-o-animation-play-state",
            "animation-play-state",
            "-webkit-animation-timing-function",
            "-moz-animation-timing-function",
            "-ms-animation-timing-function",
            "-o-animation-timing-function",
            "animation-timing-function",
            "-webkit-animation-delay",
            "-moz-animation-delay",
            "-ms-animation-delay",
            "-o-animation-delay",
            "animation-delay",
            "-webkit-animation-iteration-count",
            "-moz-animation-iteration-count",
            "-ms-animation-iteration-count",
            "-o-animation-iteration-count",
            "animation-iteration-count",
            "-webkit-animation-direction",
            "-moz-animation-direction",
            "-ms-animation-direction",
            "-o-animation-direction",
            "animation-direction",
            "text-align",
            "-webkit-text-align-last",
            "-moz-text-align-last",
            "-ms-text-align-last",
            "text-align-last",
            "vertical-align",
            "white-space",
            "text-decoration",
            "text-emphasis",
            "text-emphasis-color",
            "text-emphasis-style",
            "text-emphasis-position",
            "text-indent",
            "-ms-text-justify",
            "text-justify",
            "letter-spacing",
            "word-spacing",
            "-ms-writing-mode",
            "text-outline",
            "text-transform",
            "text-wrap",
            "text-overflow",
            "-ms-text-overflow",
            "text-overflow-ellipsis",
            "text-overflow-mode",
            "-ms-word-wrap",
            "word-wrap",
            "word-break",
            "-ms-word-break",
            "-moz-tab-size",
            "-o-tab-size",
            "tab-size",
            "-webkit-hyphens",
            "-moz-hyphens",
            "hyphens",
            "pointer-events",
            "opacity",
            "filter:progid:DXImageTransform.Microsoft.Alpha(Opacity",
            "-ms-filter:\\'progid:DXImageTransform.Microsoft.Alpha",
            "-ms-interpolation-mode",
            "color",
            "border",
            "border-width",
            "border-style",
            "border-color",
            "border-top",
            "border-top-width",
            "border-top-style",
            "border-top-color",
            "border-right",
            "border-right-width",
            "border-right-style",
            "border-right-color",
            "border-bottom",
            "border-bottom-width",
            "border-bottom-style",
            "border-bottom-color",
            "border-left",
            "border-left-width",
            "border-left-style",
            "border-left-color",
            "-webkit-border-radius",
            "-moz-border-radius",
            "border-radius",
            "-webkit-border-top-left-radius",
            "-moz-border-radius-topleft",
            "border-top-left-radius",
            "-webkit-border-top-right-radius",
            "-moz-border-radius-topright",
            "border-top-right-radius",
            "-webkit-border-bottom-right-radius",
            "-moz-border-radius-bottomright",
            "border-bottom-right-radius",
            "-webkit-border-bottom-left-radius",
            "-moz-border-radius-bottomleft",
            "border-bottom-left-radius",
            "-webkit-border-image",
            "-moz-border-image",
            "-o-border-image",
            "border-image",
            "-webkit-border-image-source",
            "-moz-border-image-source",
            "-o-border-image-source",
            "border-image-source",
            "-webkit-border-image-slice",
            "-moz-border-image-slice",
            "-o-border-image-slice",
            "border-image-slice",
            "-webkit-border-image-width",
            "-moz-border-image-width",
            "-o-border-image-width",
            "border-image-width",
            "-webkit-border-image-outset",
            "-moz-border-image-outset",
            "-o-border-image-outset",
            "border-image-outset",
            "-webkit-border-image-repeat",
            "-moz-border-image-repeat",
            "-o-border-image-repeat",
            "border-image-repeat",
            "outline",
            "outline-width",
            "outline-style",
            "outline-color",
            "outline-offset",
            "background",
            "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader",
            "background-color",
            "background-image",
            "background-repeat",
            "background-attachment",
            "background-position",
            "background-position-x",
            "-ms-background-position-x",
            "background-position-y",
            "-ms-background-position-y",
            "-webkit-background-clip",
            "-moz-background-clip",
            "background-clip",
            "background-origin",
            "-webkit-background-size",
            "-moz-background-size",
            "-o-background-size",
            "background-size",
            "box-decoration-break",
            "-webkit-box-shadow",
            "-moz-box-shadow",
            "box-shadow",
            "filter:progid:DXImageTransform.Microsoft.gradient",
            "-ms-filter:\\'progid:DXImageTransform.Microsoft.gradient",
            "text-shadow"
        ]
    ]
}
```

### Emmet

Sublime Text -> Preferences -> Package settings -> Emmet -> Settings User

```js:Emmet.sublime-settings
{
	// Ctrl + e の無効化
	"disabled_keymap_actions": "expand_abbreviation",
	// 言語の設定
	"snippets": {
		"variables": {
			"lang": "ja",
			"locale": "ja-JP"
		}
	}
}
```

### DocBlockr

Sublime Text -> Preferences -> Package settings -> DocBlockr -> Settings User

```js:DocBlockr.sublime-settings
{
	// 日本語入力が出来ないのを回避
	"jsdocs_extend_double_slash": false,
}
```

### Local History

Sublime Text -> Preferences -> Package settings -> Local History -> Settings User

```js:LocalHistory.sublime-settings
{
	// 履歴を残す日数
	"file_history_retention": 30,
	// 上限バイト数 (256KB)
	"file_size_limit": 262144,
	// trueにするとファイルを閉じる時に保存
	"history_on_close": false
}
```

## おまけ
>PHPCS は、PSR2 などのコーディング規約に違反している箇所を指摘してくれるツール。
>PHPMD は、不必要な変数や余分なコード、長すぎる名前･行など Buggy なコードを指摘してくれるツール。