闇雲なハイライトにさようなら。Sublime Textで「自社専用言語」を完璧に支配する方法
こんにちは。開発環境の深淵を覗き込み、日々のコーディングを「呼吸するような軽やかさ」に変えることを信条としているアーキテクトです。
多くのエンジニアが「なんとなく」既存のハイライト設定に甘んじていますが、本当のプロフェッショナルは違います。自社独自のDSL（ドメイン特化言語）や、トリッキーな設定ファイル。これらが黒一色の文字で表示されているのは、あなたの脳のリソースを無駄に消費しているのと同じです。
今日は、Sublime Textの奥義である「`.sublime-syntax`」を自作し、あなたのコードを「意味のある色」で塗り分ける方法を伝授します。これをマスターすれば、バグの予兆は視覚的に浮かび上がり、開発スピードは劇的に向上します。
—
1. なぜ「自作シンタックス」が必要なのか？
IDEが提供する標準のハイライトは、あくまで「汎用言語」用です。自社フレームワークの特殊なキーワードや、複雑な設定ファイルは、IDEから見ればただの文字列です。
独自のシンタックス定義を行うと、エディタはあなたのコードの「構造」を理解し始めます。「どこが関数で、どこがパラメータか」をエディタが認識すれば、検索、リファクタリング、そして何より読みやすさが段違いになります。 これは単なる装飾ではなく、開発体験（DX）を決定づける「知的な投資」なのです。
—
2. 準備：魔法のディレクトリへアクセスする
まずは、Sublime Textに「ここを読み取れ」と指示する場所へ移動しましょう。
1. Sublime Textを開く。
2. メニューの `Preferences` > `Browse Packages…` を選択。
3. 開いたフォルダの中に `User` というフォルダがあります。ここに、あなたの新しい言語定義を格納します。
—
3. 実践：.sublime-syntaxの構造を解剖する
Sublime Textのシンタックス定義はYAML形式です。今回は「自社設定ファイル（拡張子 `.mycfg`）」を例に、キーワードを青く、コメントを灰色にする定義を作成しましょう。
`User/MyConfig.sublime-syntax` というファイルを作成し、以下を記述してください。
%YAML 1.2
—
言語の名前（エディタの選択肢に表示される）
name: MyConfig
この言語を識別する拡張子
file_extensions:
- mycfg
識別子（他のパッケージから参照する際の名前）
scope: source.myconfig
contexts:
# メインのエントリーポイント
main:
# コメントの定義（# で始まる行）
- match: ‘#.’
scope: comment.line.number-sign.myconfig
# 予約語の定義（例: ‘setup’ や ‘deploy’ をハイライト）
- match: ‘\b(setup|deploy|init)\b’
scope: keyword.control.myconfig
# 値の定義（コロンの後の文字列を認識）
- match: ‘:\s(.)’
captures:
1: string.unquoted.myconfig
このコードの「賢いポイント」
- `\b`（単語境界）: これを忘れると、`deployment` という単語の一部まで `deploy` として反応してしまいます。境界を意識するのが、プロの正規表現です。
- `captures`: 正規表現のグループ化（`()`）を利用して、コロンの後の値を別のスコープとして切り出しています。これにより、値の部分だけ色を変えるといった細かい制御が可能になります。
—
4. 仕上げ：テーマと連携させる
定義しただけでは色はつきません。Sublime Textの現在のカラーテーマが、あなたの定義した `keyword.control.myconfig` などのスコープをどう扱うか、マッピングを確認する必要があります。
もし、特定の色を強制したい場合は、`User` フォルダに `MyConfig.sublime-color-scheme` を追加します。
{
“variables”: {},
“rules”: [
{
“name”: “MyConfig Keywords”,
“scope”: “keyword.control.myconfig”,
“foreground”: “#FF8800” // 明るいオレンジで強調
}
]
}
—
5. 動作確認：HelloWorldの極意
作成が終わったら、即座に確認です。
1. `.mycfg` という拡張子のファイルを新規作成します。
2. ファイル内に以下のテキストを書き込みます。
# サーバー設定
setup: production
deploy: force
3. 右下の言語選択メニューから `MyConfig` を選択（自動で認識されるはずです）。
どうでしょう？ `#` 以降がグレーに、`setup` や `deploy` がオレンジに輝き始めましたね。これが、あなたの手で作り上げた「エディタの知性」です。
—
最後に：アーキテクトからのアドバイス
シンタックス定義は、一度書けば終わりではありません。自社フレームワークが進化すれば、定義も進化させます。
この「コードを視覚的に整理する技術」を身につけると、「コードを読む速度」そのものが物理的に速くなります。 脳が余計なノイズを処理せず、ロジックの本質だけに集中できるからです。
さあ、あなたのプロジェクトにある「汚れた設定ファイル」を、美しく読みやすいものに変えてみてください。それが、最強のエンジニアへの第一歩です。何か分からないことがあれば、いつでもまた聞きに来てくださいね。応援しています。