読者です 読者をやめる 読者になる 読者になる

寒い日の夜は、膝関節が成長期。

MacminiとiPadminiでゴニョゴニョしてます

[Mac] Sublime text 3 インストール はじめにやること - プラグイン - (Setup 3of5)

はじめに

  1. インストール
  2. Package Controlをいれる
  3. 日本語設定
  4. デザイン変更
  5. プラグイン
  6. Emacsライクなキーバインド変更
  7. 不具合関連を直す

1〜3. インストールから日本語設定まで


4. デザイン変更


5. プラグイン

5-1. PHP関連のプラグイン

▽ SublimeCodeIntel
シンタックスハイライトや自動入力補完、関数定義先へのジャンプなどをできるようにするプラグイン
install packageからインストールします

▽ SublimeLinter
文法ミスの時などに囲って表示してくれるやつです。
PHPの場合はSublimeText2を使うマシンにPHPをインストールしないといけません。
まずは、「win」+「r」で名前を指定して実行ウィンドウを出し、「cmd」でコマンドプロンプトを呼び出しましょう。
そして「php -v」と入力してPHPが入ってるか確認しましょう。
入ってなかったらここからNonThreadSafe版のZIPを落として解凍し、適当なディレクトリに設置しましょう。
ちなみにこの記事を書いたときの最新が5.4.10でした。
設置したらシステム環境変数に設置したフルパスを追加します。
「win」+「e」でマイコンピュータを呼び出し、右クリック→プロパティを開き、 サイドバーの「システム詳細設定」から開いて設定します。(win7の場合)
ここまで終わったらもう1度コマンドプロンプトでphp -vしてちゃんとインストールされているか確認します。
ここまでできたらあとはSublimeText2を起動してお約束コマンドから「SublimeLinter」を入力してEnterで導入完了です。
install packageからインストールします


▽ CTags
SublimeCodeIntelと同じく、関数へのタグジャンプをするプラグインです。
これもctagsからインストールしないといけません。
まずはここからwin32のバイナリをダウンロードして解凍します。
上記同様に環境変数に解凍して設置したフルパスを追加します。
最後に同様にコマンドプロンプトから「ctags --version」を叩いてバージョン情報が出ればOKです。
その後、SublimeText2からお約束コマンド→「CTags」→SublimeText2を再起動で完了です。
install packageからインストールします

▽ PHPDoc
PHPDoc形式のコメントを補完してくれます。

▽ Phpcs
PHPの補完

5-2. HTML/CSS関連のプラグイン

▽ HTML5
HTMLの自動補完

▽ CSS Snippets
CSSの自動補完

▽ Bracket Highlighter
タグの開始タグと閉じタグをハイライト表示

▽ AutoFileName
imgタグのパスのファイル名を補完

▽ Tag
閉じタグ

5-3. JavaScript関連のプラグイン

▽ JQuery
JQueryの入力補完をしてくれます

5-4. コードチェック関連

コードのエラーチェック・コード規約などを指摘してくれます
▽ SubLimeLinter
▽ SublimeLinter-php
▽ SublimeLinter-phpmd
▽ SublimeLinter-phpcs
▽ SublimeLinter-phplint
PHPの構文チェッカー
▽ SublimeLinter-html-tidy
HTML5の構文チェッカー
▽ SublimeLinter-jshint
JavaScriptの構文チェッカー
▽ SublimeLinter-json
JSONの構文チェッカー

5-5. その他

▽ SFTP
保存するとrsyncと同様の動きをしてくれます
・丸ごとダウンロード・アップロード
・ファイルを保存した瞬間に自動アップロード機能
・ファイルを選んだ瞬間に自動ダウンロード機能
ランダムに出る購入販促アラートが出ますが、僕はあまり気にならないかも。
もし気になる場合は、16ドルで正規版になるので、気に入ったらご購入してみるといいかもです。

▽ SyncedSideBar
現在開いているファイルと、サイドバーのファイルを同期してくれるパッケージ

▽ Emmet LiveStyle
Developer Toolsから直接CSSが編集
(Google ChromeまたはSafariの連動が別途必要)

▽ ColorPicker
カラーピッカーを表示




6. Emacsライクなキーバインドの設定



7. 不具合関連を直す