まえがき

開発で使用するエディタとしてSublimeTextを使っているのですが、
ふと見たら自宅ノートPCに入ってるものは諸々の設定がされていませんでした。。

なので、ついでにココに記録を残しておいて、
また新しいPCを使うときに利用しようかと思います。

インストール

Sublime Text 3はここ。

Download - Sublime Text

ライセンスの登録

すでに購入したものがメールに届いているので、
その本文に記載されたライセンスコードをコピペする。

Package Control

Installation - Package Control

(2020/05/04追記)
いつの間にかコンソールからソース実行しなくてよくなったんですね。
コマンドパレット（ctrl+shift+p）開いて Install Package Control 入力だけでいいのは助かる。

各種設定ファイル

一部プラグインの設定もあるので、後で書いたほうがいいかもしれないけど、
そのまま忘れそうなのでここで記載する。

Settings

{
    "color_scheme": "Packages/Theme - Cobalt2/cobalt2.tmTheme",
    "default_line_ending": "unix",
    "draw_white_space": "all",
    "font_face": "MyricaM M",
    "font_options":
    [
        "no_italic"
    ],
    "font_size": 11,
    "highlight_line": true,
    "highlight_modified_tabs": true,
    "ignored_packages":
    [
    ],
    "indent_guide_options":
    [
        "draw_normal",
        "draw_active"
    ],
    "show_encoding": true,
    "show_line_endings": true,
    "tab_size": 4,
    "theme": "Cobalt2.sublime-theme",
    "translate_tabs_to_spaces": true,
    "trim_trailing_white_space_on_save": true,
    "vintage_start_in_command_mode": true
}

• カラーテーマはCobalt2を使ってる
• フォントはMyricaM Mを使ってる（Myricaのインストールが必要）
• ignored_packagesからVintageを削除

あとは大体見たまんま。

KeyBindings

[
  { "keys": ["ctrl+tab"], "command": "next_view" },
  { "keys": ["ctrl+shift+tab"], "command": "prev_view" },
  { "keys": ["ctrl+pagedown"], "command": "next_view_in_stack" },
  { "keys": ["ctrl+pageup"], "command": "prev_view_in_stack" },
  { "keys": ["ctrl+t", "ctrl+t"], "command": "goto_definition" },
  { "keys": ["ctrl+t", "ctrl+r"], "command": "jump_back" },
  { "keys": ["ctrl+t", "ctrl+y"], "command": "jump_forward" },
  { "keys": ["f5"], "command": "refresh_folder_list" },
  { "keys": ["ctrl+shift+h"], "command": "goto_documentation" }
]

• GotoDocumentationとSublimeCodeIntelの設定もあるけど気にしない

  • それぞれのところでも記載しておく

• デフォルトのタブ移動だと落ち着かないので書き換え

• たまにサイドバーが更新されないのでF5を入れとく

プラグイン

入れてるプラグインを順不同で記載。
使ってるヤツだけ記載しているので、概ねこの通りにいれればいいハズ。。

ConvertToUTF8

たまにSJISとかのファイルを開いたときに文字化けるので、
それを解消するために使ってる。

特に設定とかは不要で、インストールすればそれでOK。

Case Conversion

名前の通り、文字列のケース変換が出来るプラグイン。
主にキャメルケース⇔スネークケースの変換で使ってる。

いろんなPrjを横断して作業してたりすると、
うっかり変数名などがスネークケースだったりキャメルケースだったり揺らいでしまうから。。

これもインストールのみ。

DocBlockr

ファンクションコメントのテンプレートを表示してくれるヤツ。
書くのがクセになってはいるものの、イチから全部書くのはメンドくさいので。。。

これもインストールすれば全て終わり。

GotoDocumentation

実行すると、いまカーソルがあたっている単語に対してマニュアルページをブラウザ表示してくれる。
プログラムの種類によって開くマニュアルは判断してくれるので、
PHP上でやればPHPマニュアル、JS上でやればMDNドキュメントが開く。

プログラム側で用意されている標準関数の引数やオプションが分からなくなったときに使う。

インストール後、KeyBindingsを変更する。

[
  { "keys": ["ctrl+shift+h"], "command": "goto_documentation" }
]

なんとなくこのショートカットキーが落ち着くので。

やってないけど、もし開くページ先を変えたい場合は、ユーザー設定にdocsを用意すればいいハズ。

SyncedSideBar

←のプロジェクトフォルダの表示位置を、いま開いているプログラムソースの位置にする。

これ、そろそろデフォルトの機能で用意してくれないのかなぁ・・・・。

SublimeCodeIntel

定義ジャンプやコード補完をしてくれるプラグイン。

インストール後、KeyBindingsを変更する。

[
  { "keys": ["ctrl+t", "ctrl+t"], "command": "goto_definition" },
  { "keys": ["ctrl+t", "ctrl+r"], "command": "jump_back" },
  { "keys": ["ctrl+t", "ctrl+y"], "command": "jump_forward" }
]

昔使ってたエディタ（Eclipseだったかも？）の定義ジャンプが↑のショートカットキーだったので。

OmniMarkupPreviewer

Qiita記事などのマークダウンファイルを書くときにもSublimeTextを使っているので、
そのプレビュー用に使ってる。

インストールすればOK・・・・のハズ。。

エラーになった

ブラウザ上で表示しようとしたら404エラーになった。。。
調べたところ、そのものズバリなページがあった。

OmniMarkupPreviewerでブラウザプレビューすると404エラーになる

助かるわぁ～(´▽｀)

Color Highlighter

CSSとかをいじる際に地味に助かる、カラー表示用のプラグイン。
昔は別なのを使ってたハズなんだけど、それが見つからなかったのでコレを入れてる。

インストールだけでも使えるが、一応ユーザー設定。

{
    "ha_style": "Filled",
}

色を塗りつぶすように変更。

InputSequence

複数個所選択していると、そこに連番をいれてくれるプラグイン。
いつも使うものではないけど、ちょっとしたときに助かる。

Package Controlには非対応なので、READMEを参考に入れる。

kazu1107/InputSequence

使い方は、

1. 連番いれたい箇所を複数個指定
2. ctrl+shift+0をいれる
3. 画面下部に出る入力欄へ連番の最初の値をいれる

でOK。

IMESupport

素の状態で日本語を入力すると、なんか画面外に入力欄が出てちと不便。。
IMESupportは、日本語入力でも適正位置に表示してくれるプラグイン。

Sublime Text 3 のインストール手順と使い方をとにかく簡単にまとめてみる（2018春）

こちらで紹介されてました。
結構長く使ってたのに知らんかった・・・・(-_-;)

(2020/05/04追記)
新しくインストールしたら、素の状態で日本語入力ができるようになってました。
なので、不要。

シンタックスハイライト

ソースのシンタックスハイライトのために入れているのは下記。

• Babel
• INI
• nginx
• Smarty

Babel以外はなくてもいい気がするけど、、、

入れたあとで、対象ファイルに紐づけるのを忘れずに。

SublimeLinter

お馴染みSublimeLinter。

各Linterについて記載。

なお、いちいち書くのが面倒だったので端折ってるが、
各対応をしたあとで設定がSublimetextを再起動（閉じる→開く）して適用する。
じゃないと反映されたか確認ができない。。。

SublimeLinter

インストールしてユーザー設定を用意する。
設定内容については別に書いたのでそっち見ればいけるはず・・・・。

Sublimelinter-php

単純なPHPの構文エラー等をはじくもの。

大前提として、PHPをPCにいれる。
公式サイトからダウンロードしたものをどっかに置いとけばいい。

ユーザー設定に

    "linters": {
        "php": {
            "cmd": "/path/to/php/exe"
        }
    },
    "paths": {
        "linux": [],
        "osx": [],
        "windows": [
            "/path/to/php/dir"
        ]
    },

を追記する。
lintersにはphp.exeまでのパスを、pathsにはphp.exeがあるディレクトリまでのパスを入れる。

Sublimelinter-phpmd

(2020/05/27 一部変更)

PHPMDは静的チェックツールで、

• 未使用の変数、メソッド、プロパティなどの検出
• 不適切な変数名、メソッド名、プロパティ名などの検出
• 巨大な、複雑な処理の検出

・・・・などなどをおこなうもの。
特に未使用変数のチェックとかしてほしかったので使用。

先にcomposerでPHPMDをインストールする。

php composer global require phpmd/phpmd=*

プロジェクト単位ではなく全体で使うのでグローバルにインストール。

インストール後、Sublimelinter-phpmd をインストールして、
以下をSublimelinterの設定に追記。

    "linters": {
        "phpmd": {
            "args": [
                "codesize",
                "design",
                "naming",
                "unusedcode"
            ]
        }
    }

phpmdをグローバルにインストールした場合、
パスを指定しなくても動くみたい。
指定する場合は cmd か executable で設定するのかな？（やってないので不明）

argsはチェック時に使用するPHPMDのルール。
ざっくり↓な感じ

うるさいのでcleancodeとcontroversialは除いてる。。
cleancodeはクラス定数を使っても怒られるのがイヤだった。
controversialはウルセー！！(ﾟДﾟ＃)てなったのでナシに。

Sublimelinter-phpcs

あまりコーディングルールについて気にするPrjがないので使ってない。
「使ってない」てことを書いておかないと「書き忘れた？！(；ﾟДﾟ)」と自分が混乱しそうなので残しとく。

SublimeLinter-annotations

@todo:とかFIXME:をハイライトしてくれる。
ないと地味に困る。。

コイツは特段設定するものはない。

Sublimelinter-eslint

ReactなJSを見たり書いたりするときに使ってる。

先にeslintをインストール。

npm install -g eslint

npmがなければnvmとかnodebrewとかを使ってインストールする。

次に、.eslintrcを用意する。
どうも、SublimeLinterがバージョン4になってからeslintのルール設定が必須になったっぽい。

{"rules": {}}

こんだけでいい。

で、Sublimelinter-eslintを入れた後、やっぱりユーザー設定を追記。

    "linters": {
        "eslint": {
            "@disable": false,
            "args": [
                "--config",
                "/path/to/.eslintrc"
            ],
            "excludes": []
        },
    }

Babelに対応したSublimelinter-eslint

eslintだけだとES6に対応したチェックがされず、importで怒られたりしてうるさい。。。
ので、Babelに対応したeslintを入れる。

npm install -g babel-eslint

.eslintrcも変更

{
    "parser": "babel-eslint",
    "rules": {
    }
}

Sublimelinter-eslintの方は設定変更なし。

カラーテーマ

ここら辺？

• Cobalt2 Flat Theme
• Theme - Cobalt2
• Material Theme

Material Themeはサイドバーでのアイコン表示とかで使ってるハズ。

まぁ、また時間みて試せばいいかな。。

あとがき

これで普段つかってる環境っぽくなったので大丈夫・・・・だと思う。

ついでなので、何か新しくプラグインをいれたときはココに追記する予定。