Sublime Text

https://www.sublimetext.com

・パッケージコントローラーインストール方法

【command + shift + p】 →【install】→【return】
表示されるウィンドウに検索文字列を入力してパッケージ名を選択

● ・Sublime Textおすすめパッケージ

・HTML, css3, プログラムコードコード( SCSS, SASS )編集に便利なSublimeTextパッケージ

（インストール方法: Command + Shift + P を押して「Package Control : Install Packages」を選択し、パッケージ名を入力してインストール。）

    { "keys": ["alt+super+d"], "command": "goto_documentation" } ,

brew install tidy-html5

● SublimeLinter-csslint の設定

例えば下記のように設定してエラー出力をゆるくします

{
    "paths": {
        "osx": ["/Users/USER-NAME/.anyenv/envs/ndenv/versions/v9.11.2/bin/"],
    },
    "linters": {
        "csslint" : {
            "ignore" : ["order-alphabetical", "important", "empty-rules", "universal-selector","font-sizes", "box-model", "zero-units", "shorthand","fallback-colors","adjoining-classes", "box-sizing"]
        }
    }
}

・PHPやRubyなどプログラミング言語編集に便利なパッケージ

・その他便利なパッケージ

(※1) Alignment を cssプロパティ（ : ）でも揃えられるようにする

【Preferences】→【Package Settings】→【Alignment】→【Settings - User】 に以下を記述して保存。

{"alignment_chars": ["=",":"] }

Goto-CSS-Declarationのショートカットを [ctrl] + ←・→ に設定する

    {
      "keys": ["ctrl+right"], "command": "goto_css_declaration",
      "args": {"goto": "next"}
    },
    {
      "keys": ["ctrl+left"],  "command": "goto_css_declaration",
      "args": {"goto": "prev"}
    }

● option 左 , option 右 で移動する

    // jump back
    { "keys": ["alt+left"], "command": "jump_back" },
    { "keys": ["alt+right"], "command": "jump_forward" },

● 前回開いたファイルを自動で次回起動時に開くのをやめる

Preference > Setting に以下を追加します

{
    "hot_exit": false,
    "remember_open_files": false,
}

● ダブルクリックでハイフンで繋いだ単語も選択できるようにする

ハイフンで繋いだ単語（ my-class ）をダブルクリック選択できるようにするには
【基本設定】→【基本設定 - ユーザ】で開くファイル に以下を追加

"word_separators": "./\\()\"':,.;<>~!@#$%^&*|+=[]{}`~?",

● 文字コードと改行コードを表示する

【基本設定】→【基本設定 - ユーザ】で開くファイル に以下を追加

"show_encoding": true,
"show_line_endings": true,

● Sublime Textで shift + return で ＜br＞ タグを挿入する

【基本設定】→【キーバインド - ユーザ】で開くファイルに

{ "keys": ["shift+enter"], "command": "insert", "args": {"characters": "<br>" } }

を追加します。

● Sublime Textで ブックマークを（設定/解除）する

    { "keys": ["super+b"], "command": "toggle_bookmark" , "args": {} },

● Sublime Textで command + J で選択中のhtmlタグを1行にまとめる（ 要 emmet ）

【基本設定】→【キーバインド - ユーザ】で開くファイルに

    { "keys": ["super+j"], "command": "run_emmet_action" , "args": {"action": "merge_lines"} } ,

を追加します。

● Sublime Textで control + option + B で表示中のソースを自動整形（インデント）出来るようにする

【基本設定】→【キーバインド - ユーザ】で開くファイルに

{ "keys": ["control+option+b"], "command": "reindent" , "args": { "single_line": false } },

を追加します。

● Sublime Textで [command]+space で選択範囲を細かく拡張する、 [command] + [shift] + space で選択範囲を大きく拡張する

【基本設定】→【キーバインド - ユーザ】で開くファイルに

  { "keys": ["super+shift+space"], "command": "expand_selection", "args": {"to": "scope"} } ,
  { "keys": ["super+space"], "command": "expand_region" } ,

を追加します。

● Sublime Textで PHPの構文チェックを出来るようにする

1. SublimeLinter-phplint をインストールする。

2. 次の node.js パッケージをインストールする

   sudo npm install -g phplint

● ShellCommandで 任意のシェルコマンドをショートカットで実行出来るようにする

例 : 「ctrl」+「3」でPHPのバージョンを表示します

  {
    "keys": ["ctrl+3"],
    "command": "shell_command",
    "args": {
      "command": "echo $PATH" ,
      "target": "point"
    }
  } ,

● Sublime Textのおすすめショートカットキー

（基本的なショートカットは除きます。 command + ↓ とか。）

● Sublime Textのカラーテーマ

こちらのサイトから選ぶといいでしょう
https://colorsublime.github.io/
( Colorsublime というパッケージのインストールが必要です。 )

合わせて、「Preference」→「Settings」に

    "highlight_line": true,

を追加しましょう。 現在行がハイライトされて編集しやすくなります。

● Sublime Textのカラーをカスタマイズする

http://tmtheme-editor.herokuapp.com
作成したファイルは拡張子「.tmTheme」をつけて

/Users/【ユーザー名】/Library/Application Support/Sublime Text 3/Packages/Colorsublime-Themes/

に移動します。
『Sublime Text』→『Preferences』→『ColorScheme ... 』から選択して適用させます。

● sublime Textでインデントの罫線を見やすくする

1. 『基本設定』→『基本設定 - ユーザ』に以下の行を追加します。

現在アクティブなインデントのカラーが強調されて見やすくなります。

    "draw_indent_guides": true,
    "indent_guide_options": ["draw_normal", "draw_active"],

2. /Users/ユーザ名/Library/Application Support/Sublime Text 3/Packages/Colorsublime-Themes/カラーセッティング名.tmThemeに以下の行を追加します。

<key>guide</key>
<string>#cccccc</string>
<key>activeGuide</key>
<string>#E91E63</string>
<key>stackGuide</key>
<string>#cccccc</string>

挿入位置は background が記述してある並びでokです。

● sublime Textおすすめのフォント

Menlo
Ricty Diminished
Souce code pro

あたりがおすすめです

● sublime Textの設定

こちらを参考にするといいです。 http://bit.ly/22xr0pC

● sublime Textでファイルタイプ（拡張子）ごとにタブの設定を変更する

『基本設定』→ 『基本設定 - 拡張』→ 『シンタックス指定 - ユーザ』を開いて以下のように記述して保存

{
    "tab_size": 4, // タブサイズ
    "translate_tabs_to_spaces": true, // タブの代わりにスペースでインデントする
    "auto_indent": true, // 自動インデント
    "smart_indent": true, // 自動インデントを少し賢く
    "trim_automatic_white_space": true // 空行の無駄な自動インデントを削除
}